Angular2如何根据条件为<select>元素动态添加name属性

不需要重复写两遍select元素，直接使用Angular内置的属性绑定逻辑即可实现需求：当绑定的属性值为null或undefined时，Angular会自动从渲染后的DOM元素上移除该属性，刚好匹配你的使用场景。

推荐写法（无重复代码） #

<select 
  class="select-input"
  [name]="type === 'withName' ? null : 'some-name'"
  (change)="handleChange($event)"
>
  <!-- 此处写你的option选项内容 -->
</select>

逻辑说明：

• 当类属性type的值为withName时，name属性绑定的值为null，渲染后的select元素不会携带name属性
• 其余场景下name属性会被赋值为some-name，正常出现在DOM上
• 公共属性class和change事件不受条件影响，所有场景都会保留

如果你坚持用*ngIf实现（不推荐，有重复代码） #

如果你之前使用ngIf失败大概率是语法写错了，正确写法如下：

<select 
  *ngIf="type === 'withName'"
  class="select-input"
  (change)="handleChange($event)"
>
  <!-- 此处写你的option选项内容 -->
</select>
<select 
  *ngIf="type !== 'withName'"
  class="select-input"
  name="some-name"
  (change)="handleChange($event)"
>
  <!-- 此处写你的option选项内容 -->
</select>

内容的提问来源于stack exchange，提问作者Peter