AngularJS - IE8 IE9从未获得调用的updateRoute方法

时间:2013-05-09 00:12:53

标签: javascript angularjs

开发应用程序并尝试使用最新的稳定且不稳定的angularJS版本 应用程序加载所有浏览器减去IE 9和IE8(可能更低)

尝试调试它看起来好像$ locationChangeSuccess广播从未被监听它的对象$ rootScope。$ on('$ locationChangeSuccess',updateRoute); 因此从不调用updateRoute方法。 但是调用了函数afterLocationChange。 由于在IE8debugger中运行的sucky IE10(我在angularJS中设置的断点没有中断),我无法进行调试,因此使用了console.log输出。

我手动引导我有一种特定的路由方式,不是使用ng-views而是使用ng-include / ng-switch并在路由中添加一个action属性,然后由主控制器进行评估并注入到视图用于ng-switch的范围。 我不知道它是否与我路由事物的方式有关,因为它看起来似乎永远不会调用updateRoute,但我仍然是代码,如果我错了。

路线定义 功能(LOGIN)

{
    LOGIN.config
    (
        [
            '$routeProvider', '$locationProvider', '$dialogProvider',
            function ($routeProvider, $locationProvider, $dialogProvider)
            {
                $locationProvider.html5Mode(true).hashPrefix = '!';

                $routeProvider
                    .when("/", { action: "login" })
                    .when("/forgot_password/", { action: "forgot_password" });
            }
        ]
    );
}

应用程序控制器

function (LOGIN)
{
    LOGIN.controller(
        'controllerApplication',
        [
            '$scope', '$route',
            function ($scope, $route) {
                var self = this;

                // Update the rendering of the page.
                this.render = function ()
                {
                    // Pull the "action" value out of the currently selected route.
                    var renderAction = $route.current.action;

                    // Also, let's update the render path so that we can start conditionally rendering parts of the page.
                    var renderPath = renderAction.split(".");

                    // Reset the boolean used to set the css class for the navigation.
                    var inLogin     = (renderPath[0] === "login");
                    var inPassword  = (renderPath[0] === "forgot_password");

                    // Store the values in the model.
                    $scope.renderAction = renderAction;
                    $scope.renderPath   = renderPath;
                    $scope.inLogin      = inLogin;
                    $scope.inPassword   = inPassword;
                    $scope.loaded       = false;
                };

                // Listen for changes to the Route.
                // When the route changes, let's set the renderAction model value
                // so that it can render in the Strong element.
                $scope.$on
                (
                    "$routeChangeSuccess",
                    function ($currentRoute, $previousRoute)
                    {
                        // Update the rendering.
                        self.render();
                    }
                );
            }
        ]
    );
}

在我的部分

<div id="main-container" ng-switch on="renderPath[0]">
    <div ng-switch-when="login" ng-include=" 'js/app/login/partials/login.html' "></div>
    <div ng-switch-when="forgot_password" ng-include=" 'js/app/login/partials/forgot-password.html' "></div>
</div>

我在这里记录了一个错误 https://github.com/angular/angular.js/issues/2608

但是没有人有这个问题似乎很奇怪,所以我很想得到人们的一些意见。

我还没有看到在IE8中运行的应用程序 如果您有任何链接,我将热衷于检查。 欢呼声。

1 个答案:

答案 0 :(得分:0)

我感到很惭愧...... :)。

经过一个小时的调试并发现角度没有找到IE的ng-controller指令后,我意识到我忘了在IE特定的html指令中包含相同的控制器......

<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en" ng-controller="controllerApplication"> <![endif]-->
<!--[if IE 7]>    <html class="no-js lt-ie9 lt-ie8" lang="en" ng-controller="controllerApplication"> <![endif]-->
<!--[if IE 8]>    <html class="no-js lt-ie9" lang="en" ng-controller="controllerApplication"> <![endif]-->
<!--[if gt IE 8]> <html class="no-js" lang="en" ng-controller="controllerApplication"> <![endif]-->