Cannot bind to 'disabled' as it is not a known property of '<button>'

I just started learning Angular, but I got the following error: Can't bind to "disabled" because it is not a known property <button>

. Searching the web I just found similar errors, but they have to do with FormsModule not being imported, which doesn't seem to be my case.

app.components.ts

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'app';
  Button = false;
}

      

app.component.html

<div style="text-align:center">
  <h1>
    Welcome to {{title}}!!
  </h1>
  <button [Disabled]="!Button">Click me</button>
</div>

      

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';

import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent,
  ],
  imports: [
    BrowserModule,
    FormsModule,
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

      

+3


source to share


1 answer


try it



 <button [disabled]="!Button">Click me</button>

      

+3


source







All Articles