单击选择标记中的选项时创建并检查值创建输入

时间:2016-04-23 10:59:08

标签: javascript angular

我试图用角度2创建一个应用程序,我有一个表单和选择标签和option.i想要当用户点击每个选项检查选项的值,如果值等于“aaa”输入字段生成底部选择标签。 我试图做多,但无法解决这个问题:)

如果有人能澄清我上面列出的问题,我真的很感激。

...谢谢

  <select name="delivery_architecture" class="form-control testing">
          <option selected="selected">plz select</option>
          <option value="static">static</option>
          <option value="dynamic">dynamic</option>
          <option value="aaa" >aaa</option>
  </select>

1 个答案:

答案 0 :(得分:1)

您可以在选择选项时填充数组,然后使用*ngFor生成输入元素。

@Component({
    selector: 'my-app',
    template: `
  <select name="delivery_architecture" class="form-control testing" (change)="addInput($event.target.value)">
    <option selected="selected">plz select</option>
    <option value="static">static</option>
    <option value="dynamic">dynamic</option>
    <option value="aaa" >aaa</option>
  </select>

  <div *ngFor="#inp of inputs" >{{inp.name}}<input [ngModel]="inp.value"></div>
  <div><button (click)="showValues()">show values</button></div>

  <div>values: {{values}}</div>
    `,
})
export class AppComponent {
  inputs = [];
  addInput(name) {
    this.inputs.push({name: name, value: ''});
  }
}

写入输入元素的值也存储在数组中。

Plunker example