IE中的Angular throws“Error：Invalid argument。”

Question

我有一個指令，它接受元素的文本，並在每第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.並沒有說明原點。）

PS：我知道IE根本不知道wbr，但這不是問題。

編輯：在我的實際應用程序中，我重寫了指令，不查看元素的文本並修改它，而是通過屬性傳遞輸入文本，現在在所有瀏覽器中都能正常工作。 但我仍然很好奇為什么原始解決方案在IE中給出了這個錯誤，從而開始了賞金。

Answer 1

您嘗試創建將元素注入字符串的指令會遇到IE中處理appendChild方法的已知錯誤。 即使在完全刪除<div>之后，我也可以用你的小提琴重現你的錯誤IE。

請注意，如果您完全刪除了div連接，並嘗試以原始形式返回newText ，那么您仍然可以獲得

錯誤：參數無效。

在UI視圖上的轉換不適用於IE9-10-11

Answer 2

我的"error invalid argument anonymous function call"正在拋出我在下面的代碼上執行以下操作。

錯誤：

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

沒錯誤：

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

Answer 3

這不是一個Angular的答案（我知道這是一個老問題），但我建議你可能采取錯誤的方法解決問題。 而是插入中斷（例如，這會破壞字符串中的任何標記），只需使用CSS文本溢出或溢出屬性。

Answer 4

當我在HTML模板中出現以下錯誤時，我在IE中遇到了同樣的錯誤：

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

禁用 textarea不允許在IE中使用ngModel

Chrome，FF沒有抱怨，只是IE Edge。 檢查模板也是個好主意