3

我不知道这是问题还是正常行为。

如果我们有这样的表格：

<form #form="ngForm" >
  <div>
     <label>field1</label>
     <input type="text" name="field1" [(ngModel)]="mainVar" [disabled]="someVar"  />                                                                                                                    
  </div>
  <div>
     <label>field2</label>
     <input type="text" name="field2" [(ngModel)]="someVar" />
  </div>
</form>

同时变量mainVar和someVar在组件中设置为空字符串：

mainVar = '';
someVar = '';

这将导致名称为field1的输入被禁用，即使someVar是空字符串。据我所知，空字符串变量应该返回false到 if 语句。

但最奇怪的是，如果我从 input field1中删除[(ngModel)]属性，它将正常工作（如果我在 input field2中输入内容，则 input field1将被禁用）

Plunker 示例

4

2 回答 2

5

更新

我在 Angular 源代码（<3 开源！）中找到了答案。控制器显式ngModel检查''何时disabled input更改。如果输入严格等于''，则元素将被禁用。所以这种行为是设计使然。

这是源代码的外观（链接到 GitHub，请参见第 142 和 217 行）

const isDisabled = disabledValue === '' || (disabledValue && disabledValue !== 'false');

这意味着您不能使用空字符串作为 falsy来设置ngModel用于禁用它的输入。

这是您解决问题的方法

<input type="text" name="field1" [(ngModel)]="mainVar" [disabled]="someVar ? true : false"  />

工作 plunker 示例

于 2017-04-05T13:21:37.117 回答
-2

将其设置为 null/undefined/false，它不会被禁用。空字符串仍然是一个值。

于 2017-04-05T12:58:20.977 回答