Question

我的angularJS（AngularJS v1.3.0-beta.3）应用程序在IE10兼容模式下崩溃。它适用于FF，Chrome和IE11。这是我在控制台中得到的错误：

Multiple directives [login, login] asking for 'login' controller on: <div>

设置应用程序状态，我创建一个节点：

link: function ($scope, $element, $attrs) {
    ....
$element.html('<login></login>');
    $compile($element.contents())($scope); // crash happens here
    ....
}

这是我的登录指令：

widgets.directive('login', ['$compile', '$http', 'resourceLoader', function ($compile, $http, resourceLoader) {
    return {
        restrict: 'AE',
        replace: true,
        template: '<div></div>',
        controller: function ($scope, $element) {
            $scope.user.isLogged = false;
            $scope.user.password = undefined;

            $scope.submitLogin = function () {
                // code that goes to server
            };
        },
        link: function ($scope, $element, $attrs) {
            resourceLoader.get('templates', 'profile', 'unlogged/login', 'jquery.min', function (template) {
                $element.html(template);
                $compile($element.contents())($scope);
            });
        }
    };
}]);

有什么想法吗？感谢名单。

Answer 1

主要问题是Angular 1.3不支持旧版本的Internet Explorer，更具体地说是IE8及更少版本。将IE10置于兼容模式将使浏览器就像某个布局和功能的旧浏览器一样。向后兼容性问题可能是罪魁祸首。

Angular的建议是保持小于1.3的版本以确保兼容性。

<强>参考文献：

请参阅Angular's post on the 1.3 update并查看Compatibility Mode settings以进一步阅读相关问题。

Answer 2

您是否尝试将指令的限制从EA更改为仅E，或者（可能更适合兼容性）仅A然后使用<div data-login="true"></div>？

看起来html的解析方式似乎很奇怪 - 我希望它可能会在兼容性方面添加一个属性供自己使用，这会搞砸一切。

如果这不起作用，如果你提供一个吸引人或小提琴来更清楚地证明问题，你就更有可能得到正确答案。

Answer 3

添加此行

if ( name === 'login' ) console.log(name, directiveFactory.toString());

在this line

如果它打印两次，你实际上是加载指令两次。打开directiveFactory的源代码后，您还会看到它是相同的指令加载两次还是两个具有相同名称的指令。

Answer 4

给id =＆＃34; ng-app＆＃34;您在哪里分配模块名称ng-app =＆＃34; module＆＃34;。这将支持IE。

Answer 5

在index.html的head部分添加以下行解决了我的问题：

 <meta http-equiv="x-ua-compatible" content="IE=edge">

了解更多信息：https://stackoverflow.com/a/46489212/698127

AngularJS和IE兼容模式

5 个答案: