Javascript 使用#名称绑定字段不起作用

我有一个表单，包含一个下拉字段和一个提交按钮， 我正在尝试根据下拉字段的选定值启用或禁用按钮。 我的代码看起来像这样

<select #drop>
<option value="">Disabled</option>
<option value="1">Enabled</option>
<option value="2">Enabled</option>
</select>

<button [disabled]="!drop.value">
</button>

残废
启用
启用

---

这在Safari上可以正常工作，但一旦做出选择，就不能在chrome中启用按钮，除非我在窗口外的某个地方单击。

如果希望使用模板变量，则必须对其进行“角度化”，即包括通过角度重新协调的事件或属性。 关于以下两个例子：

1.使用

ngModel

：

<select #drop ngModel >
  <option value="">Disabled</option>
  <option value="1">Enabled</option>
  <option value="2">Enabled</option>
</select>
<button [disabled]="!drop.value">Button</button>

---

如果您使用的是

ngModel

，它能工作吗？

<select #drop (change)="null" >
  <option value="">Disabled</option>
  <option value="1">Enabled</option>
  <option value="2">Enabled</option>
</select>
<button [disabled]="!drop.value">Button</button>