假设我设置了一个angular ui路由器路由。当我改变到那个状态时,我告诉Angular我希望它先解析一个工厂调用,然后再加载视图。但是当api调用为空时会发生什么呢?我想通知用户没有找到结果,并保持在我的原始状态。不能转换到没有数据要显示的另一个视图。实现这一目标的最佳方式是什么?
路线(到目前为止,当我知道会有返回时,它按预期工作)
'use strict';
angular.module('testApp')
.config(function ($stateProvider) {
$stateProvider
.state('spinnerTest', {
url: '/spinner_test',
templateUrl: 'app/spinnerTest/spinnerTest.html',
controller: 'SpinnerTestCtrl',
resolve: {
names: function(NamesService){
//What happens if I return an empty array []?
//How do I return to the previous state?
NamesService.getNames();
}
}
});
});
如果数组为空,可以在resolve中拒绝promise:
resolve: {
names: function(NamesService) {
return NamesService.getNames().then(function(names) {
return names.length == 0 ? $q.reject('no names') : names;
});
}
}
这是一个横切问题,它可能不是Name服务所独有的,您正在使用的其他服务也是如此。
由于您没有将代码发布到名称服务(NameService服务是多余的),我将假设它使用$http或$resource服务。然后,你可以使用$httpInterceptor来触发向用户显示一条消息:"当前选择不可用"。
如果您愿意,可以在解析中调用$state.go
'use strict';
angular.module('testApp')
.config(function ($stateProvider) {
$stateProvider
.state('spinnerTest', {
url: '/spinner_test',
templateUrl: 'app/spinnerTest/spinnerTest.html',
controller: 'SpinnerTestCtrl',
resolve: {
names: function(NamesService, $state){
//What happens if I return an empty array []?
//How do I return to the previous state?
return NamesService.getNames().then(function(names){
if (!names.length) {
return $state.go('otherState');
}
return names;
});
}
}
});
});