为动态生成的 ngModel Angular (2/4) 分配初始值

Question

我发现我可以使用this method 创建动态 ngModel 变量。这很好用，因为我正在尝试基于列表生成一堆文本输入，然后在它们上放置一个 ngModel 变量。我遇到的问题是我想为文本框分配一个初始值，以便它显示该值（以及 ngModel 的值），然后显然用户可以在框中键入，更改ngModel 变量。

不过，我想不出办法。如果我为输入设置一个值，它就会被清除。它还需要使用 ngModel 而不是 2 路数据绑定（{{}} 方法）来完成，因为我需要能够稍后引用该变量。

下面是我尝试让它工作。您可以假设“items”是一个字符串值列表。

<ul>
 <li *ngFor = "let item of items">
  <input type = "text" [(ngModel)] = "input[item]" value = '{{item}}'>
 </li>
</ul> 

总的来说，我对 Angular 和 web 开发人员也很陌生，所以我可能会遗漏一些非常明显的东西，如果是这种情况，我深表歉意。无论如何，我真的很感激任何帮助。

Answer 1

您应该在控制器中执行此操作。

@Component({
    // component configuration
})
class MyController implements OnInit {

    public input: Object = {
        // your data
    };

    public items: Array<Object> = [
        // your list of items
    ];

    ngOnInit() {

        this.items.forEach(item => {
            input[item] = item;
        });

    }

}