Angular和Internet Explorer 11 - 输入不正确的工作

Question

我在IE浏览器（包括11版本和之前的所有版本）中使用ng-model输入时遇到了严重问题，但在其他所有浏览器中一切正常。这个问题是上周首次观察到的。我们没有更新应用程序的这个部分，也没有收到用户在上周之前报告此问题的任何报告。

我们正在运行Angular 1.4.3。

基本上，像这样的输入框：

<input data-ng-model="answer.value"></input>

模型没有正确更新。看起来是onChange或onFocus事件的问题-输入永远不会失去它们的ng-pristine和ng-untouched类。它们正确地显示了模型的初始值，但用户进行的任何更新都无法保存。我们尝试向头部添加了<meta http-equiv="X-UA-Compatible" content="IE=11" />标签，但没有效果。从输入中删除所有验证也没有任何影响。控制台没有错误或警告。

- Levi Morris

---

inputs 不需要闭合的 </input> 标签。只需使用自闭合标签 <input data-ng-model="answer.value" />。这可能不是问题...但也有可能是！ - An0nC0d3r

它也不能作为自闭合标签使用。 - Levi Morris

我遇到了与 ng-model 在 IE 中输入不更新的相同症状，但不确定根本原因是否相同。在我们的应用程序中，问题是树上的一个 div 设置了 disabled 属性。 - alpha-mouse

你的输入框有类型吗？例如<input type="text" ng-model="answer.value"></input>？ - Rani Radcliff

@RaniRadcliff 我们所有的输入都是有类型的。我最好的猜测是这与IE中onFocus事件的可怕处理有关，但我们决定不值得花费大量时间完全审计它，而是完全放弃了IE支持。 - Levi Morris

Answer 1

在我的情况下，我有一个父组件和一个子输入框。

父组件选择了一个不好的Angular绑定属性; 我称之为属性“disabled”。 disabled是一个糟糕的自定义属性名称，因为它是许多HTML元素的标准属性。

当我将自定义属性名称更改为“custom-disabled”时，子输入框开始响应。

Internet Explorer解释了一些祖先disabled属性，这意味着所有后代都应该被禁用； 因此，我的angular输入ng-model、ng-change、ng-blur、ng-focus都没有起作用。

我应该知道：当我询问$('input').is(':disabled')时，结果是true。我忽略了这一点，因为input元素本身没有disabled属性；只有一个祖先元素有！

- Nate Anderson

Answer 2

我是一名有帮助的助手，以下是您需要翻译的内容：

我曾经遇到过类似的问题，而解决方法似乎很简单。如果您的代码与下面的代码类似：

<form name="myForm">
    <table ng-disabled="formToggle">
        ...
        <input ng-model="form.name" />
        ...
    </table>
</form>

IE10和IE11不会检查表单字段，也不会设置它们的原始脏值（其他浏览器正常工作）。只需从表格（在这种情况下）或父元素中删除ng-disabled即可解决问题。

- Michał Ignaszewski

---

很遗憾，在我们的设置中没有实际的<form>元素。如果我有机会，我会尝试尝试你的推理 - 目前距离我们正式停止IE支持已经快一年了，我们非常高兴不再支持它！ - Levi Morris