我已經達到了一個完整的塊,並可以真正使用一些見解,我可能會做錯在這裏。我有頂部搜索欄和下面的查看區域來加載不同的模板。當index.html加載時,SearchController(在search-controller.js中)加載並等待提交。在使用DailySearchController(在daily-search-controller.js中)的-the-day.html的平均時間ng-view加載中,可以說是填充當天的數據。 DailySearchController和SearchController共享相同的服務(search-service.js)。直到這一點,數據填充,一切都很好。
現在,當我輸入數據到輸入字段並點擊提交時,client-search.html模板加載到查看(最多),表單數據發送到控制器,到服務(這似乎到目前爲止還可以),然後回到控制器,在那裏我現在有問題。我可以看到,在Chrome插件Batarang中,json數據確實到達了我的$ scope對象,但它並沒有更新視圖。
的index.html
<html ng-app="MM">
...//everything included
<body>
<form ng-controller="SearchController" ng-submit="mmSubmitSearch()" class="submit-main" id="submitMain">
<input ng-model="mmMdlSearchBox" class="mdl-search-box" id="mdlSearchBox" placeholder="find your quote..." type="text">
</input>
<input type="submit" class="btn-submit" id="btnSubmit" value="Search"></input>
</form>
<div ng-view></div>
</body>
</html>
客戶search.html
<ul class="ul-query">
<li class="li-header"> QUOTE RESULTS...</li>
<li ng-repeat="resource in mmClientReq.quotes | orderBy:clientList" class="li-resource">
<p class="p-resource">{{resource.quote}}</p>
<p class="p-resource-link">
<a class="a-link" href="#/resource/search/link/version/{{resource.version}}/book/{{resource.book}}/chapter/{{resource.chapter}}"> Ch {{resource.chapter}}:{{resource.verse}}</a>
{{resource.book}}, {{resource.version}}
</p>
</li>
</ul>
的最day.html
<ul class="ul-query">
<li class="li-header"> SOURCE OF THE DAY</li>
<li ng-repeat="resource in mmClientReqDaily.quotes | orderBy:clientList" class="li-resource">
<p class="p-resource">{{resource.quote}}</p>
<p class="p-resource-link">
<a class="a-link" href="#/resource/search/link/version/{{resource.version}}/book/{{resource.book}}/chapter/{{resource.chapter}}"> Ch {{resource.chapter}}:{{resource.verse}}</a>
{{resource.book}}, {{resource.version}}
</p>
</li>
</ul>
日常搜索controller.js
angular.module('MM.ControllerModule')
.controller('DailySearchController', ['$http', '$scope', 'SearchService',
function ($http, $scope, SearchService) {
getDailyReq();
function getDailyReq() {
SearchService.getDailyReq()
.success(function(data) {
$scope.mmClientReqDaily = data;
})
.error(function(data) {
...
});
};
}]);
搜索controller.js
angular.module('MM.ControllerModule')
.controller('SearchController', ['$scope', '$location', 'SearchService',
function ($scope, $location, SearchService) {
$scope.mmSubmitSearch = function() {
var userData = this.mmMdlSearchBox;
$location.path('/resource/search');
SearchService.getSearch(userData)
.success(function(data) {
$scope.mmClientReq = data;
})
.error(function(data) {
...
});
};
}]);
搜索service.js
angular.module('MM.ServiceModule')
.service('SearchService', ['$http', '$location',
function ($http, $location) {
var searchBaseURL = ('/resource/search/client-search?text=');
this.getDailyReq = function() {
return $http.get($location.path());
};
this.getSearch = function(searchURL) {
return $http.get(searchBaseURL + searchURL);
}
}]);
客戶search.html模板載荷視圖,但僅顯示標題,不會顯示一切。
我對此並不完全確定,但你可能成爲模型中的事物的受害者。嘗試將所有數據添加到$ scope.myModel而不是$ scope。或者明確地將數據屬性添加到$ scope,以便Angular知道它已經改變。 – 2014-09-23 04:26:31
任何機會,你可以把這個,所以我可以有一個小提琴? (或者撥弄這個,這樣我可以跳過它) – 2014-09-23 04:26:54
你可以嘗試'$ scope。$ apply'來觸發摘要循環。 – Jorg 2014-09-23 05:26:10