I am new to angular.
On the project I created a component named as button and on the button.components.ts file I added the code of Input on import { Component, OnInit, **Input** } from '@angular/core'; and then afterwards I added the following code just above the button.component.ts constructor
@Input() text:string;
But it is throwing me an error on the word text, the error says,
Property 'text' has no initializer and is not definitely assigned in the constructor
The full code of the button.component.ts is as follows,
import { Component, OnInit, Input } from '@angular/core';
@Component({
selector: 'app-button',
templateUrl: './button.component.html',
styleUrls: ['./button.component.css']
})
export class ButtonComponent implements OnInit {
@Input() text:string;
constructor() { }
ngOnInit(): void {
}
}
Referring to the link shared by @Rohith V when I initialize the text value inside the constructor it throws me an error on another component where I have called this button component.
Throws me an error on a component named as header.component.html
<header>
<h1>{{title}}</h1>
<app-button color="green" **text**="Add"></app-button>
</header>
The error says
Type 'string' is not assignable to type 'any[]'
The updated button.component.ts is as follows,
import { Component, OnInit, Input } from '@angular/core';
@Component({
selector: 'app-button',
templateUrl: './button.component.html',
styleUrls: ['./button.component.css']
})
export class ButtonComponent implements OnInit {
@Input() text:any[];
constructor() {
this.text = [];
}
ngOnInit(): void {
}
}
