Question

我正在处理一些代码，但是在Google上找不到任何代码。基本上，我想将一个代表ID的数字传递给实例化时要使用的组件。

我不知道该怎么尝试

<div class="row">
    <div class = "col-xs-12">
        <app-server *ngFor  = "let server of servers"></app-server>
    </div>
</div>

构造函数或ngOnInit将被传递一个数字参数。

Answer 1

在app-server的组件中，您将需要import { Component, Input } from '@angular/core';

然后，我们可以使用@Input让组件知道您将通过模板接收该变量的值。

所以组件看起来像

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

@Component({
    selector: "app-server",
    templateUrl: "...,
    styleUrls: ["..."]
})
export class AppServerComponent {

    @Input id: number;

    //.. rest of code

}

在您的模板中，您可以像这样提供值：

<app-server *ngFor="let server of servers" [id]="desired_id_value"></app-server>

如何传递给组件构造函数或ngOnInit

1 个答案: