Can't Bind To Since It Isn't A Known Property Of Selector Component

I want to pass a variable from one component to another and I'm using @input This is my parent component : @Component({ selector: 'aze', templateUrl: './aze.component.html'

Solution 1:

Few thing to try

First make sure you have import Input into your component

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

Then follow pascal convention when naming class

exportclassazeComponentimplementsOnInit

should change to

exportclassAzeComponentimplementsOnInit

Then register your component into your module declarations

Also import BrowserModule into your module also something like this

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

import { AppRoutingModule } from'./app-routing.module';
import { AppComponent } from'./app.component';

@NgModule({
  declarations: [
    AppComponent,
    MyDialogComponent,
    AzeComponent   
  ],
  imports: [
    BrowserModule,
    AppRoutingModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export classAppModule { }

Solution 2:

Mostly you'll get this error because you forgot to declare the component into your app.module.ts or did it wrong

app.module.ts

import { YourSpecificComponent } from'./components/measureUnit/measure-unit-monthly/measure-unit-monthly.component';

@NgModule({
declarations: [
    AppComponent,
    MessageComponent,
    DashboardComponent,
    .....,
    YourSpecificComponent, // declared here
}

your-specific.component.ts

@Component({
    selector: 'app-your-specific', // your selectortemplateUrl: './your-specific.component.html',
    styleUrls: [
        '../some.css'
    ]
})

export class YourSpecificComponent implements AfterContentInit {
.....

Solution 3:

ok this error causes because you need to import MyDialogComponent in azeComponent's module.