内容不会随着路线的改变而更新
Content doesn't update on route change
当我改变路由时,从说/set/1
到/set/2
,然后它仍然显示来自/set/1
的信息,直到我手动刷新页面,我尝试将$route.refresh
添加到链接到这些页面的ng-click
,但这也不起作用。什么好主意吗?
下面是路由代码,这工作得很好,所有的路由都是通过链接完成的,只是<a>
标签指向路由。
angular.module('magicApp', ['ngRoute']).config(['$routeProvider', function($routeProvider) {
$routeProvider.when('/', {
templateUrl: 'pages/home.html'
}).when('/set', {
redirectTo: '/sets'
}).when('/set/:setID', {
controller: 'SetInformationController',
templateUrl: 'pages/set.html'
}).when('/card', {
redirectTo: '/cards'
}).when('/card/:cardID', {
controller: 'CardInformationController',
templateUrl: 'pages/card.html'
}).when('/sets', {
controller: 'SetListController',
templateUrl: 'pages/sets.html'
}).when('/cards', {
controller: 'CardListController',
templateUrl: 'pages/cards.html'
}).when('/search/:searchterm', {
controller: 'SearchController',
templateUrl: 'pages/search.html'
}).otherwise({
redirectTo: '/'
});
}]);
下面是SetListController的代码,它使用routeParams从服务中获取正确的信息,这是有效的,当我转到/set/1
时,它返回正确的信息,如果我然后返回到/set/2
,它仍然显示来自set 1的信息,直到我刷新页面。
.controller('SetInformationController', function($scope, $routeParams, $route, SetInformationService, CardSetInformationService) {
$scope.set = [];
$scope.cards = [];
function init() {
SetInformationService.async($routeParams.setID).then(function(d) {
$scope.set = d;
});
CardSetInformationService.async($routeParams.setID).then(function(d) {
$scope.cards = d;
})
}
init();
})
HTML本身没有对控制器的引用,或者类似的东西,只有作用域中的对象,即set
和cards
。
我明白了!问题不在于路由,而在于我的服务,下面是之前的服务:
.factory('SetInformationService', function($http) {
var promise;
var SetInformationService = {
async: function(id) {
if ( !promise ) {
// $http returns a promise, which has a then function, which also returns a promise
promise = $http.get('http://api.mtgdb.info/sets/' + id).then(function (response) {
// The then function here is an opportunity to modify the response
console.log("Set Information");
console.log(response);
// The return value gets picked up by the then in the controller.
return response.data;
});
}
// Return the promise to the controller
return promise;
}
};
return SetInformationService;
})
.factory('SetInformationService', function($http) {
var promise;
var SetInformationService = {
async: function(id) {
// $http returns a promise, which has a then function, which also returns a promise
promise = $http.get('http://api.mtgdb.info/sets/' + id).then(function (response) {
// The then function here is an opportunity to modify the response
console.log("Set Information");
console.log(response);
// The return value gets picked up by the then in the controller.
return response.data;
});
// Return the promise to the controller
return promise;
}
};
return SetInformationService;
})
相关文章:
- 变量dos'即使我可以返回更新后的值,也不会改变
- ReactJS:如何在改变状态后立即更新组件
- 是否在应用程序缓存清单更新时更新所有文件?或者只是改变了的那些
- ng节目没有'当我的收音机型号改变时,我不会更新
- 在不改变循环速度的情况下更改更新速度
- 如何更新谷歌地图,如果它的地图画布改变了它的尺寸
- 当模型更新时,backbone和knockout如何使视图改变
- 在ipad上基于方向改变更新值
- Angularjs指令:如何在属性改变后更新模板中的ng-class
- 当变量改变时,在AngularJS中更新视图
- AJAX数据库更新与CSS按钮颜色改变使用Codeigniter
- 当绑定变量改变时,Angularjs选择不更新
- 在AngularJs中,基于指令属性的改变来更新UI
- 为什么knockoutjs js不't更新视图,如果一些子数组被改变
- 当引用对象改变时,react .js视图不更新
- Vue-router 2改变路由,但不更新视图
- 谷歌地图更新标记从改变mysql坐标
- 在Angular和Nodejs应用中,如果我改变了html文件,它也不会更新浏览器
- 更改url后,Angular模型不会改变(更新)
- 在一个选项卡的状态改变后,Onsen选项卡没有正确更新