Question

这是我第一次使用带角度js的routeProvider。该项目目前有两页：home和user。两个页面都完全加载并正确地与其控制器交互。但是，“正在加载...”文本显示在两个页面的底部。

[注意：我之前曾报道过“正在载入...”文字只出现在其中一个页面上。但实际上它出现在两个页面上。]

当然，在页面上“加载...”是完全不可接受的，但我不知道它为什么会存在。这是angular已插入页面的HTML：

<div block-ui-container="" class="block-ui-container ng-scope">
  <div class="block-ui-overlay"></div>
  <div class="block-ui-message-container" aria-live="assertive" aria-atomic="true">
    <div class="block-ui-message ng-binding" ng-class="$_blockUiMessageClass">Loading ...</div>
  </div>
</div>

这是routeProviderCode：

var projectApp = angular.module("mainProjectModule",
    ['ngRoute', 'blockUI', 'ngSanitize', 'ui.bootstrap']);

function resolver(path) {
    return {
        resolver: ['$q','$rootScope',
            function($q, $rootScope) {
                var deferred = $q.defer();
                require([path], function() {
                    $rootScope.$apply( function() {
                        deferred.resolve();
                    });
                });
                return deferred.promise;
            }
        ]
    }
}

projectApp.config(['$routeProvider',
    function($routeProvider) {
        var pageNames = [ 'home', 'user' ];
        pageNames.forEach( function(pageName) {
            $routeProvider
                .when('/'+pageName, {
                    templateUrl:   '/project/ajs/'+pageName+'.html',
                    resolve:       resolver(pageName+'Controller')
                });
        });
        $routeProvider.otherwise({redirectTo: '/home'});
    }
]);

// Bootstrap Angular when DOM is ready
angularAMD.bootstrap(projectApp);

我的控制器是否应该使用某种信令机制来清除此字符串？

Answer 1

在这里回答我自己的问题，这更像是一个解决方案，而不是一个真正的答案。我仍然希望知道解决此问题的正确方法。

我使用包含angular-block-ui的模板启动了项目（请参阅https://github.com/McNull/angular-block-ui）。当路由提供者加载模板时，看起来这个block-ui正在幕后调用（参见上面的原始路由提供者代码）。我并非100％肯定，因为＆＃34;正在加载......＆＃34;消息实际上并没有阻塞任何内容，但它是我在加载模板时可能会看到的那种默认阻止消息。调用是我无法控制的（据我所知），所以没有调试 - 进入angular-js代码（不，谢谢！），它不清楚发生了什么或为什么。

angular-block-ui网站说你可以通过这个电话停止阻止：

blockUI.stop();

我将此代码添加到控制器中，但没有效果。

所以解决方法是我已经在项目的css文件中添加了一个指令来隐藏这样的消息：

.block-ui-overlay + .block-ui-message-container {
  display:none;
}

显然这是一个黑客，但它简单而有效。

使用带有block-ui和routeProvider的AngularJS，页面加载完成后页面显示“正在加载...”

1 个答案: