2016-03-03 24 views
0

大概就像我想的那样简单,但我真的无法在网上找到我的问题的答案,所以我希望你们只需看一小段代码即可知道答案。解析必须包含来自控制器的所有承诺?

问题:我在Angular中使用UI路由器,并在所有数据加载之前加载模板。所以所有的输入字段在模板已经加载后都会接收到正确的值。所以输入字段是空的第二个或两个....

我觉得我的决心是不应该的:

所以我的UI路由器代码看起来是这样的(检查对象的决心) :

$stateProvider.state('teststate', { 
    url: '/test/', 
    templateUrl: 'app/page/template.html', 
    controller: 'testCtrl', 
    resolve: { 
     access: ["Access", function(Access) { return Access.isAuthenticated(); }], 
     UserProfile: 'UserProfile' 
    } 
}); 

现在控制器包含了承诺,从API网址,以获取一些数据:

function TestCtrl($scope, $state, $stateParams, TestService) { 

    TestService.get($stateParams.id).then(function(response) { 
     $scope.data = response; 
    }); 
} 

现在(连接到API)服务应该承诺返回CONTRO米勒:

TestService.factory('TestService', ['Restangular', function(Restangular) { 

    var factory = {}; 

    factory.get = function(id) { 
     return Restangular.one('api/test', id).get(); 
    } 

    return factory; 

}]); 

现在,可以在问题是,因为在控制器内的TestService.get()(连接到API),被执行装载模板不前,因为它不是resolve对象里面?那么UI路由器不能解析对API的调用?我只是好奇,或者我应该移动所有方法,使API调用,对$stateProvider内的每个stat的解析对象。

我可以运行很多测试,但如果有人直接通过查看这个问题直接知道答案,它可以帮助我很多。

回答

0

你的假设都是正确的。

如果在路由配置中的数据将随时提供给控制器作为一种可注射的资源

+0

谢谢!很高兴知道:) –

0

解决TestService.get如果你不想让你的控制器运行和您的模板,以显示你之前所有的API调用完成,你必须把它们全部放在UI路由器resolve中。

但是,如果API请求可能需要一些时间,则在您的API调用正在运行时,立即转换到新页面并显示某种加载指示符(例如block-ui)似乎更好。

+0

另一个更简单的模块是[angular-busy](https://github.com/cgross/angular-busy)。只需将它指向承诺 – charlietfl

+0

block-ui,您也可以为所有异步请求启用它。我猜这两个库之间最大的区别是角度繁忙通常附加到页面的特定部分,而block-ui会阻止整个页面。 –

+0

也可以在全球范围内使用它 – charlietfl