动态设置ngModel

时间:2018-03-27 13:58:04

标签: angular angular2-template angular2-forms angular-ngmodel two-way-binding

我正在尝试构建一个基本的轮询应用程序,其中包含图像中显示的字段。 This is the view of the app. The template of the App. The ts file for the component. I haven't written any kinda logic in this file just logging out the value of the form. As I enter value for the first field the second field also gets updated with the same value.  How can I achieve two way binding in this case?

由于有两个输入的字段,我想要为每个字段绑定(选项1和选项2分别作为option1和option2,所以我可以在ts文件中引用它。) 但是当我为第一个字段键入选项时,第二个字段也会得到相同的值&同样适用于第二场。如何为每个输入字段设置双向绑定?

点击Create Poll按钮后,控制台显示为:         {           "问题":"谁将赢得世界杯?",           "选项1":"德国",           "选项2":"德国"         }

2 个答案:

答案 0 :(得分:2)

使用您的索引:

[(ngModel)]="options[i]"

并在组件中创建一个选项数组

答案 1 :(得分:2)

您可以只使用一组选项而不是简单的变量选项,并在模板中使用它:

count = [1, 2];
options: string[2];

...

[(ngModel)]="options[i]"

options [0]有第一个,options [1]有第二个