我正在尝试使用 Angular 和 RESTful 网络服务构建搜索功能。我是 Angular 的新手,请多多包涵。
我的事件处理和与 Web 服务的通信有线并正常工作。问题是,当我将搜索查询的结果分配给 $http 成功回调中的 $scope 时,我的 View 永远不会更新。
但是,我确实在 $http
回调中取回了数据,如果我尝试在此回调中使用静态数据更新我的模型,这也不会显示。
我完全不知道是我将结果记录推送到错误的 $scope
还是发生了什么。 $scope.$apply()
不起作用,因为模型更新已经在进行中。我也尝试了不同版本的 Angular,但无济于事。使用 $resource 而不是 $http
没有解决问题。
有人知道吗?提前致谢
我还设置了一个 JSFiddle在 Controller 中进行更多诊断
我的 HTML:
<div ng-app="myApp"> <div ng-controller="SearchCtrl"> <div ng-repeat="result in results" class="result"> <div class="board"> <div class="name">{{result.board}}</div> <div class="posts">{{result.posts}}</div> <div class="clear"></div> </div> <div class="clear"></div> </div> </div> <div> <form ng-submit="doSearch()" ng-controller="SearchCtrl" name="search" id="search"> <input type="text" value="" ng-model="searchTerm" name="q" id="searchterm"></input> <button class="search" id="searchbtn" type="submit">Search</button> </form> </div> </div>
my controller:
myApp.controller('SearchCtrl', function ($scope, $http) {
$scope.results = [];
$scope.doSearch = function () {
data = 'json=' + encodeURIComponent(angular.toJson([{
board: "one", posts: 435
}, {
board: "two", posts: 123
}]));
$http.post('/echo/json/', data, {
headers: {
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
}
}).success(function (data) {
for (var i in data) {
$scope.results.push(data[i]);
}
});
};
})
最佳答案
您正在创建 Controller 的两个实例。表单和列表必须在同一个 <div ng-controller="SearchCtrl">
内元素。 <form>
不应该有自己的SearchCtrl
请参阅此处修复的问题:http://jsfiddle.net/EeUrY/68/ .
关于javascript - Angular.js View 不会更新 $http XHR 结果,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17436212/