Angular throws"错误:参数无效。"在IE中

时间:2014-05-27 14:24:54

标签: javascript angularjs internet-explorer angularjs-directive

我有一个指令,它接受元素的文本并在每第10个字符后放置wbr个元素。我在例如具有长文本(例如URL)的表格单元格上使用它,因此它不会跨越表格。指令代码:

myApp.directive('myWbr', function ($interpolate) {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            // get the interpolated text of HTML element
            var expression = $interpolate(element.text());

            // get new text, which has <wbr> element on every 10th position
            var addWbr = function (inputText) {
                var newText = '';
                for (var i = 0; i < inputText.length; i++) {
                    if ((i !== 0) && (i % 10 === 0)) newText += '<wbr>'; // no end tag
                    newText += inputText[i];
                }
                return newText;
            };

            scope.$watch(function (scope) {
                // replace element's content with the new one, which contains <wbr>s
                element.html(addWbr(expression(scope)));
            });
        }
    };
});

在IE中工作正常(我已经尝试过IE8和IE9),它向控制台抛出错误:Error: Invalid argument.

以下是jsFiddle,点击该按钮可以在控制台中看到错误。

如此明显的问题:为什么那里出现错误,它的来源是什么,为什么只在IE?

(额外的问题:如何让IE开发工具告诉我更多关于错误的信息,比如来自源代码的一行,因为我花了一些时间找到它,Error: Invalid argument.并没有说明它的来源。)

P.S。:我知道IE根本不知道wbr,但这不是问题。

在我的实际应用程序中

编辑:我重写了指令,不查看元素的文本并修改它,而是通过属性传递输入文本,现在在所有浏览器中都能正常工作。但我仍然很好奇为什么原始解决方案在IE中给出了这个错误,从而开始了赏金。

4 个答案:

答案 0 :(得分:9)

您尝试创建将元素注入字符串的指令会遇到IE中处理appendChild方法的已知错误。即使在完全删除<div>后,我也可以用你的小提琴重现你的错误IE。

请注意,如果您完全删除了div连接,并尝试以原始格式返回newText,那么仍然可以

  

错误:参数无效。

Transclusion on UI view not working on IE9-10-11

答案 1 :(得分:1)

我的"error invalid argument anonymous function call"被我抛弃,在下面的代码中执行以下操作。

错误:

<span data-ng-bind="name.first">{{name.first}}</span>

没有错误:

<span data-ng-bind="name.first"></span>

答案 2 :(得分:0)

不是一个Angular的答案(我知道这是一个老问题),但我建议你可能采取错误的方法解决问题。而是插入断点(例如,会破坏字符串中的任何标记),只需使用CSS文本溢出或溢出属性。

答案 3 :(得分:0)

在HTML模板中出现以下错误时,我在IE中也遇到了相同的错误:

<textarea disabled  [(ngModel)]="some.var">{{some.var}}</textarea>

已禁用文本区域不允许IE中的ngModel

Chrome,FF没有抱怨,只是IE Edge。 最好也检查模板