在angular2中设置HTML <select>元素的默认值

时间:2016-07-19 09:59:01

标签: typescript angular

如何在angular2中设置HTML元素的默认值? 最简单的方法是我的以下尝试。 这还行不通,有人可以帮帮我吗? //从模板中提取 &lt; div class =&#34; form-group&#34;&gt;   &lt; label for =&#34; status&#34;&gt;状态:&lt; / label&gt;   &lt; select class =&#34; form-control&#34;命名=&#34;状态&#34; #status =&#34; ngModel&#34; [(ngModel)] =&#34; statusValueToSet&#34;所需&GT;     &lt;选项已停用&gt;选择此处&lt; / option&gt;     &lt; option * ngFor =&#34; let status of status&#34; [值] =&#34;状态&#34;&GT; {{状态}}     &LT; /选项&GT;   &LT; /选择&GT; &LT; / DIV&GT; //在组件类中 状态:字符串[] = [&#34;新&#34;,&#34;接受&#34;,&#34;无效&#34;];

1 个答案:

答案 0 :(得分:3)

只需在您的课程正文中初始化statusValueToSet,但请在选择中保留Choose here选项:

// extract from template
<div class="form-group">
  <label for="status">Status: </label>
  <select class="form-control" name="status" #status="ngModel" [(ngModel)]="statusValueToSet" required>
    <option [value]="''">Choose here</option>
    <option *ngFor="let status of statuses" [value]="status">{{status}}
    </option>
  </select>
</div>

statuses: string[] = ["New", "Accepted", "Invalid"];
statusValueToSet: string = "";