我正在使用异步调用的服务。
服务看起来像那样;
var routesApp = angular.module('routesApp', []);
routesApp.factory('angRoutes', function($http) {
var angRoutes = {
async: function(id) {
var data = $.param({
query: id
});
var config = {
headers : {
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8;'
}
}
var promise = $http.post('../ajax-php.php', data, config)
.success(function (data, status, headers, config) {
return data;
console.log(data);
})
.error(function (data, status, header, config) {
});
return promise;
}
};
return angRoutes;
});
当页面首次加载时,我使用一个控制器来填充范围;
routesApp.controller('topRoutesCtrl', function topRoutesCtrl($scope,$http, angRoutes) {
angRoutes.async('top').then(function(data) {
$scope.angRoutes = data;
console.log(data);
});
});
这一切都很有效。但是,当用户点击某些内容时,我会使用另一个控制器。
routesApp.controller('navRoutesCtrl', function navRoutesCtrl($scope,$http, angRoutes) {
$scope.update = function(id) {
angRoutes.async(id).then(function(data) {
$scope.angRoutes = data;
console.log(data);
});
}
我能够看到我在控制台中获得的数据,并且id确实在更新功能中传递,数据是核心但是它接收到我的范围没有得到更新。它仍然是页面加载时首次发送的值。
如何更新我的范围?
更新
在我的角度HTML中,我像这样做了重复
<div ng-controller="topRoutesCtrl" class="ajax">
<div id="ajaxLoader"> <img class="loadingGif" src =" /images/ajax-loader.gif"> </div>
<div data-ng-repeat="r in angRoutes.data" class="routes-block" >
{{r.name}}
</div>
</div>
现在我的角度JS如果我做
routesApp.controller('topRoutesCtrl', function topRoutesCtrl($scope,$http, angRoutes) {
angRoutes.async('top').then(function(data) {
$scope.angRoutes = data;
console.log(angRoutes);
});
});
请注意,在控制台中我可以看到相同的内容,如果我console.log(data)
或console.log(angRoutes)
我的应用程序只有在我执行$scope.angRoutes = data;
时才有效,如果我这样做$scope.angRoutes = angRoutes;
1}}
所以也许我在ng-repeat中使用错误的方式参考
答案 0 :(得分:0)
你可以使用wrapper $ timeout来手动启动$ digest cicle
$scope.update = function(id) {
angRoutes.async(id).then(function(data) {
$timeout(function() {
$scope.angRoutes = data;
}
console.log(data);
});
}
但请记住,在$ http调用和写入行为很奇怪之后会自动触发$ digest cicle