I have a component and I want to implement an interface. However, this doesn't seem to be working. When I hover over @Component in Visual Studio Code, I get an error indicating that it can't resolve all parameters for component.
Here is what is looks like:
import { Component, Input, OnInit } from '@angular/core';
@Component({
selector: 'app-reaction',
templateUrl: './reaction.component.html',
styleUrls: ['./reaction.component.scss']
})
export class ReactionComponent implements OnInit, MvReaction {
@Input() data: MvReaction;
constructor(
public id: number,
public name:string,
public image: string,
public count: number,
public selected: boolean) { }
ngOnInit() { }
}
export interface MvReaction{
id: number,
name : string,
image : string,
count ?: number,
selected ?: boolean
}
And when I use the component, I get:
StaticInjectorError(AppModule)[ReactionComponent -> Number]: \n
StaticInjectorError(Platform: core)[ReactionComponent -> Number]: \n
NullInjectorError: No provider for Number!
The properties should not be set in the constructor. The constructor is reserved for dependencies. You should be doing:
import { Component, Input, OnInit } from '@angular/core';
@Component({
selector: 'app-reaction',
templateUrl: './reaction.component.html',
styleUrls: ['./reaction.component.scss']
})
export class ReactionComponent implements OnInit, MvReaction {
@Input() data: MvReaction;
public id: number;
public name:string;
public image: string;
public count: number;
public selected: boolean;
constructor() { }
ngOnInit() { }
}
export interface MvReaction{
id: number,
name : string,
image : string,
count ?: number,
selected ?: boolean
}
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments