Trying to figure out how to properly display an array of servers in my HTML using *ngFor. I've been searching online for hours but can't seem to find the solution. It's becoming really frustrating...
1 First Component:
@Component({
selector: 'app-server',
templateUrl: './servers.component.html',
styleUrls: ['./servers.component.css']
})
export class ServerComponent implements OnInit {
serverId: number;
serverName: string;
serverStatus: string;
constructor(id: number, name: string, status: string) {
this.serverId = id;
this.serverName = name;
this.serverStatus = status;
}
}
2 Second Component:
@Component({
selector: 'app-servers',
templateUrl: './servers.component.html',
styleUrls: ['./servers.component.css']
})
export class ServersComponent implements OnInit {
servers: Object[];
serverObj: Object;
constructor() {
this.servers = [];
this.serverObj = new ServerComponent(0, "testN", "testS");
}
createServer() {
this.servers.push(this.serverObj);
}
}
}
3 Error Message:
Compiled with problems:
ERROR
src/app/app.module.ts:12:5 - error NG6001: The class 'ServerComponent' is listed in the declarations of the NgModule 'AppModule', but is not a directive, a component, or a pipe. Either remove it from the NgModule's declarations, or add an appropriate Angular decorator.
12 ServerComponent,
~~~~~~~~~~~~~~~
src/app/server/server.component.ts:9:14
9 export class ServerComponent implements OnInit {
~~~~~~~~~~~~~~~
'ServerComponent' is declared here.
ERROR
src/app/server/server.component.ts:14:15 - error NG2003: No suitable injection token for parameter 'id' of class 'ServerComponent'.
Consider using the @Inject decorator to specify an injection token.
14 constructor(id: number, name: string, status: string) {
~~
src/app/server/server.component.ts:14:19
14 constructor(id: number, name: string, status: string) {
~~~~~~
This type is not supported as injection token.