javascript - 如何在 ajax 在 Angular Js 上完成之前加载 View ？

Question

我正在使用 Angular Js 中的 Ionic 框架构建一个 ios 应用程序。在我的应用程序中遵循我的路由示例

.state('app.friends', {
网址:'/ friend '，
缓存:错误，
要求登录:真实，
观点:{
'菜单内容':{
templateUrl: 'templates/friends.html',
Controller :'friendsCtrl'
}
}
})

这里我正在加载一个模板 friends.html，它的 Controller 是 friendsCtrl。在 friendsCtrl 中，我有一个 ajax 函数，它调用 api 并获取 json 格式的 friend 列表。我遇到的问题是在 ajax 完成之前我的模板不会加载到 View 中。有时当 api 上有大数据时，它需要很长时间。所以我想在 ajax 完成之前显示空 View 。我看到很多关于在 View 渲染之前完成 ajax 的问题和答案，但就我而言，我想在 ajax 完成之前渲染 View 。如何做到这一点请给我建议。

谢谢

Answer 1

您可以使用延迟对象 ($q) 来实现此目的，请参阅 https://docs.angularjs.org/api/ng/service/ $q

或者，您可以通过将其包装在超时函数($timeout)周围来强制加载在稍后发生 - 参见 https://docs.angularjs.org/api/ng/service/ $超时

编辑

someFunc () {
    $scope.somevar = {};
    $http.get('url').then(
        function(response){
            $scope.someVar = response.data;
        });
    return $scope.somevar;      // returns {}
}

======================================

    someFunc () {
        var deferred = $q.defer();
        $http.get('url').then(
            function(response){
                $scope.someVar = response.data;
                deferred.resolve();
            });
        return deferred.promise;    // return a promise to set someVar
    }

    var $scope.somevar = {};
    someFunc().then(
        function() {
            console.log("somevar is set");
        });