在 AngularJS 中执行 `ng-view` 之前预加载数据和 HTML

Question

在我的应用程序中，我喜欢为 ng-view 集成一些东西。基本上，在用户点击 link 后，我想停止 ng-view 直到：

加载页面需要的所有数据
加载所有数据后，创建必要的 DOM 元素

然后，让emng-view执行。到那时，让我显示 pre-loader 图标或一些消息说“等待..”

正确的做法是什么？

目前没有任何想法，我就这样使用我的路线。

$routeProvider
            .when ("/issueDetails", {
                templateUrl : "views/issueDetails/issueDetails.html",
                controller  : "issueDetailsController",
                className   : "body-issueDetails",
                resolve: {
                  // I will cause a 2 second delay
                delay: function($q, $timeout) {
                    var delay = $q.defer();
                    $timeout(delay.resolve, 2000); //delaying 2 sec.
                    return delay.promise;
                  }
                }
        });

但它并没有产生这么好的结果。谁能告诉我正确的方向？

Answer 1

如果我对您的理解正确，这应该发生在您看来的 html 中。

<div ng-if="!DataImWaitingFor">
    ...Please wait while my data is fetched
</div>
<div ng-if="DataImWaitingFor">
    [all the cool stuff that makes this page worth looking at]
</div>

或者只是将它们放在不同的文件中并使用 ng-include。

也许我误会了，但我不明白为什么您需要延迟视图本身。也许如果你能解释为什么这对你不起作用，我会更好地知道如何提供帮助。

在 AngularJS 中执行 `ng-view` 之前预加载数据和 HTML

Preloading Data and HTML Before Executing `ng-view` In AngularJS

angularjs

angular-routing