I've designed a new interface that I plan to incorporate into my custom Angular component.
Here is the Interface:
export interface Gadget {
constructor(
gadgetID: string,
gadgetName: string,
gadgetModel: string,
buildYear: string,
gadgetOS: string
);
}
Custom component implementation:
import { Component, OnInit} from "@angular/core";
import { Gadget } from "src/shared/interfaces/gadget";
@Component({
selector: 'gadget-dashboard',
templateUrl: './gadget-dashboard.component.html',
styleUrls: ['./gadget-dashboard.component.less']
})
export class GadgetDashBoardComponent implements OnInit{
constructor() {}
gadgets: Gadget[] = [
{
gadgetID: "12345",
gadgetName: 'name',
gadgetModel: 'model',
buildYear: '2015',
gadgetOS: 'Ubuntu 22.04',
},
];
ngOnInit(): void { }
However, I am facing an issue where the TS compiler keeps pointing out the first property and gives me the following error message on hover.
Type '{ gadgetID: string; gadgetName: string; gadgetModel: string; buildYear: string; gadgetOS: string; }' is not assignable to type 'Gadget'.
Object literal may only specify known properties, and 'gadgetID' does not exist in type 'Gadget'.