在我的AngularJS控制器上触发ng click事件后,UI未更新
我用ng click事件绑定了一个按钮,该事件在我的控制器上触发一个函数。这会再次使用$http获取一些数据,而且效果很好。但是在成功回调中更新我的模型时,UI不会得到更新。我尝试过使用$scope.$apply和$scope.safeApply,但运气不佳。UI中没有发生任何事情。数据从服务返回。请参阅下面的代码 搜索控制器:在我的AngularJS控制器上触发ng click事件后,UI未更新,angularjs,angularjs-scope,Angularjs,Angularjs Scope,我用ng click事件绑定了一个按钮,该事件在我的控制器上触发一个函数。这会再次使用$http获取一些数据,而且效果很好。但是在成功回调中更新我的模型时,UI不会得到更新。我尝试过使用$scope.$apply和$scope.safeApply,但运气不佳。UI中没有发生任何事情。数据从服务返回。请参阅下面的代码 搜索控制器: 'use strict'; searchApp.controller('SearchController', function SearchControlle
'use strict';
searchApp.controller('SearchController',
function SearchController($scope, searchData) {
$scope.query = '';
$scope.isLoading = false;
$scope.result = null;
$scope.doSearch = function () {
$scope.isLoading = true;
searchData.getSearchResult($scope.query, function (result) {
$scope.safeApply(function() {
$scope.result = result;
console.log($scope.result);
});
});
};
$scope.safeApply = function (fn) {
var phase = this.$root.$$phase;
if (phase == '$apply' || phase == '$digest') {
if (fn && (typeof (fn) === 'function')) {
fn();
}
} else {
this.$apply(fn);
}
};
}
);
HTML标记:
<div class="search-result" ng-controller="SearchController">
<input type="text" value="Enter query..." ng-model="query" />
<input type="button" value="Search" ng-click="doSearch()" />
<div ng-show="isLoading">
Searching....
</div>
<h2>{{ result.SearchGroups }}</h2>
<div class="result-box" ng-repeat="group in result.SearchGroups">
<div class="head">
<h2>{{ group.Name }}</h2>
<!--<span class="seeAll">Se alle (13)</span>-->
</div>
<div class="body">
</div>
</div>
</div>
搜索。。。。
{{result.SearchGroups}
{{group.Name}
忘掉$safeApply
之类的东西。只要searchData.getSearchResult
使用$http
发出请求,您就不需要调用$apply
或$safeApply
。只有从非角度源获取事件时,才需要这些。换句话说,在控制器中,很少需要dall$apply
。如果你发现自己在做这件事,你应该知道原因
因此,假设您的结果
即将通过,将其分配给$scope.result
应该就可以了。要问的一些问题:
控制台日志是否打印出来?你真的收到你的数据了吗
result
是否有名为SearchGroups
的属性?案件敏感事项{{result}}
是否显示任何内容如果这些问题都没有结果,您能否共享您的
searchData.getSearchResult
服务功能?您的ng在代码中单击的位置?忘记了输入元素。代码已更新。