CODEWITHSUNDEEP
angularkendo-ui-angular2asp.net-core-2.0
Kawatron
Kawatron

Reputation: 11

Can't bind to 'primary' since it isn't a known property of 'button' Error

Please Help!! I am trying to add a kendo button with the property [primary] = 'true' but I get this error:

NodeInvocationException: Template parse errors: Can't bind to 'primary' since it isn't a known property of 'button'. (" ][primary]="true">Log in 

app.module.browser.ts

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppModuleShared } from './app.module.shared';
import { AppComponent } from './components/app/app.component';

import { CommonModule } from '@angular/common';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { InputsModule } from '@progress/kendo-angular-inputs';
import { ButtonsModule } from '@progress/kendo-angular-buttons';

@NgModule({
    bootstrap: [ AppComponent ],
    imports: [
        CommonModule
        , BrowserModule
        , AppModuleShared
        , BrowserAnimationsModule
        , InputsModule
        , ButtonsModule
    ],
    providers: [
        { provide: 'BASE_URL', useFactory: getBaseUrl }
    ]
})
export class AppModule {
}

export function getBaseUrl() {
    return document.getElementsByTagName('base')[0].href;
}

html

<div class="BodyBG">
    <table style="width: 100%;">
        <tr>
            <td>
                <div id="login">
                    <h4>LIS 2.0</h4>
                    <div id="divOldLogin">
                        <form (ngSubmit)="login(fLogin)" #fLogin="ngForm">
                            <fieldset id="inputs">
                                <input kendoTextBox id="txtUsername" name="username" type="text" placeholder="Username" autofocus="autofocus" required="required" ngModel/>
                                <div id="password">
                                    <input kendoTextBox id="txtPassword" name="password" type="password" placeholder="Password" required="required" ngModel />
                                </div>
                                <button kendoButton type="submit" id="btnSubmit" (click)="login()" [primary]="true">Log in</button>&nbsp;
                            </fieldset>
                        </form>
                    </div>
                </div>
            </td>
        </tr>
    </table>
</div>

Upvotes: 1

Views: 3446

Answers (1)

topalkata
topalkata

Reputation: 2098

The error suggests that the kendoButton directive is not recognized

The ButtonsModule needs to be imported in the same module where the component(s) using it is declared.

Alternatively, if the ButtonsModule is imported in another module that is in turn imported in the module where the component that uses the Kendo buttons is declared, the ButtonsModule needs to be also reexported from the common module it is imported in (via the exports array).

Docs reference

Upvotes: 1

Related Questions