Javascript IE10上的AngularJS+，text带有占位符“原因”的区域；无效的论点。”；

在IE10+上使用angularJS（带占位符的TextArea）时，我得到了“无效参数”

这只会在textarea节点用

关闭时发生，而在我现在关闭textarea本身时不会发生

这将引发“无效参数”异常：

<div ng-app>
    <input ng-model="placeholderModel" type="text"/>
    <textarea id="message" placeholder="{{placeholderModel}}" ng-model="textareaModel"></textarea>
</div>

<div ng-app>
    <input ng-model="placeholderModel" type="text"/>
    <textarea id="message" placeholder="{{placeholderModel}}" ng-model="textareaModel"/>
</div>

<textarea ng-attr-placeholder="placeholderModel" ng-model="textareaModel"></textarea>

<textarea placeholder="{[{ 'NAME' | translate }]}" ng-model="name" name="name"></textarea>

<textarea placeholder="{[{ 'NAME' | translate }]}" ng-model="name" name="name"> </textarea>

这将毫无问题地工作：

<div ng-app>
    <input ng-model="placeholderModel" type="text"/>
    <textarea id="message" placeholder="{{placeholderModel}}" ng-model="textareaModel"></textarea>
</div>

<div ng-app>
    <input ng-model="placeholderModel" type="text"/>
    <textarea id="message" placeholder="{{placeholderModel}}" ng-model="textareaModel"/>
</div>

<textarea ng-attr-placeholder="placeholderModel" ng-model="textareaModel"></textarea>

<textarea placeholder="{[{ 'NAME' | translate }]}" ng-model="name" name="name"></textarea>

<textarea placeholder="{[{ 'NAME' | translate }]}" ng-model="name" name="name"> </textarea>

---

这里的运行示例：

我知道这个问题现在已经很老了，但我想我也会把我的想法放进去。几个月前，我们遇到了这个问题，不得不寻求解决方案，因此我们最终使用这个指令来解决这个问题：

mod.directive('placeHolder', [
    function(){
        return {
            restrict: 'A',
            link: function(scope, elem, attrs){
                scope.$watch(attrs.placeHolder, function(newVal,oldVal){
                    elem.attr('placeholder', newVal);
                });
            }
        };
    }
]);

然后您可以在视图中使用它：

<textarea place-holder="placeholderModel" ng-model="textareaModel"></textarea>

一旦模型数据到达（可能是异步的），该指令将向

属性添加一个传统的

占位符

，它将按照您的需要工作

---

这不是最好的解决方案，但它是有效的。希望这能有所帮助。

这似乎是绑定元素占位符的方式存在问题-我知道这很奇怪

我能够在IE中使用指令而不是直接绑定到DOM中的属性，使一切正常工作

例如，而不是：

试试这个：

<div ng-app>
    <input ng-model="placeholderModel" type="text"/>
    <textarea id="message" placeholder="{{placeholderModel}}" ng-model="textareaModel"></textarea>
</div>

<div ng-app>
    <input ng-model="placeholderModel" type="text"/>
    <textarea id="message" placeholder="{{placeholderModel}}" ng-model="textareaModel"/>
</div>

<textarea ng-attr-placeholder="placeholderModel" ng-model="textareaModel"></textarea>

<textarea placeholder="{[{ 'NAME' | translate }]}" ng-model="name" name="name"></textarea>

<textarea placeholder="{[{ 'NAME' | translate }]}" ng-model="name" name="name"> </textarea>

---

相关：

我今天遇到了这个错误，偶然发现了这个问题。这是为我解决这个问题的方法

之前：

<div ng-app>
    <input ng-model="placeholderModel" type="text"/>
    <textarea id="message" placeholder="{{placeholderModel}}" ng-model="textareaModel"></textarea>
</div>

<div ng-app>
    <input ng-model="placeholderModel" type="text"/>
    <textarea id="message" placeholder="{{placeholderModel}}" ng-model="textareaModel"/>
</div>

<textarea ng-attr-placeholder="placeholderModel" ng-model="textareaModel"></textarea>

<textarea placeholder="{[{ 'NAME' | translate }]}" ng-model="name" name="name"></textarea>

<textarea placeholder="{[{ 'NAME' | translate }]}" ng-model="name" name="name"> </textarea>

之后：

<div ng-app>
    <input ng-model="placeholderModel" type="text"/>
    <textarea id="message" placeholder="{{placeholderModel}}" ng-model="textareaModel"></textarea>
</div>

<div ng-app>
    <input ng-model="placeholderModel" type="text"/>
    <textarea id="message" placeholder="{{placeholderModel}}" ng-model="textareaModel"/>
</div>

<textarea ng-attr-placeholder="placeholderModel" ng-model="textareaModel"></textarea>

<textarea placeholder="{[{ 'NAME' | translate }]}" ng-model="name" name="name"></textarea>

<textarea placeholder="{[{ 'NAME' | translate }]}" ng-model="name" name="name"> </textarea>

---

注意文本区域内的小空间，这实际上阻止了IE的抱怨…

这刚刚解决了IE的另一个错误，角度和文本区域。非常感谢。仍然存在：仅供参考：我在Android chrome上也遇到了同样的问题。网页应该显示什么？在IE10+中：甚至这个：

工作起来很奇怪。它同时更新占位符和内容：当我们可以使用指令时，PNo无需编写自定义指令。：）老实说，我不知道存在

ngattr-*

指令。这听起来肯定会奏效。这对我不起作用，但你让我走上了正确的道路！我使用了：translate>{'translate_ME'}}}<并且有这个问题（除了IE的所有版本之外，其他地方都可以使用）。当我切换到：>{{'TRANSLATE_ME'| TRANSLATE}}}<它甚至在IE中也能工作。它不再抛出错误，但也不会显示占位符文本。除了你删除空间后，他们可能在Windows10中修复了它。实际上，我最终得到了一个指令，它不执行

element.innerText=''到每个文本区域，因为我不想麻烦在所有文本区域中都留下一个空格。这一点可以证明IE很差劲！德克萨斯州@F.H。；确保文本区域的关闭标记与打开标记位于同一行上（显然，仅IE需要）。
ngAttrPlaceholder
似乎不推荐使用。如果仍要使用此方法，则可能需要使用所演示的自定义指令。或者，你可以按照另一个答案的建议，在两个选项之间加一个空格。