在控制器内的http调用之后加载部分文件

Posted 2021-04-14

我有一个控制器和一个部分文件。部分文件尝试访问由控制器设置的变量。但是这里的问题是控制器通过进行http调用来填充变量的范围对象，并且由于这个ajax请求，当http调用返回数据时，部分文件已经被加载，因此我将变量作为未定义。此外，虽然在浏览器上加载了部分文件，但是由于在http响应返回后范围值被绑定，因此数据会在延迟后填充。

在AngularJs中是否有一种方法，只有在控制器中的http调用获取数据后才加载部分文件/指令，以便视图立即加载数据，而不是在一些延迟之后加载。请让我知道如何解决这个问题。

答案

如果你在谈论在ng-view中加载的部分，你可以在路线上使用$routeProvider resolve属性。此属性可以采用返回值或promise的函数。在承诺的情况下，只有在解决了承诺后才会加载视图。你的代码看起来像

 $routeProvider.when('/', {
            templateUrl: 'app.html', 
            controller:myAppController, 
            resolve:{
                data:function($http){
                    return $http.get('url');   //this by default returns promise.
                }
            }
        });

在控制器中，您现在还可以将resolve的data属性作为参数注入并访问数据。

也请参阅此视频以了解解决http://www.thinkster.io/angularjs/6cmY50Dsyf/angularjs-resolve-conventions