リストを更新する際に問題が発生しました。私はrootscopeとfactoryを使ってみましたが、ビューを更新しません。むしろそれは同じままです。更新プログラムが動作する唯一の時間は、リストが空の場合は最初の負荷が常に存在することです。提案を感謝してください。ここでangularjsのあるコントローラから別のコントローラへ現在のリストを更新しますか?
はrootscopeを使用して私の試みです:
rootscopeの代替categories.html
app.config(['$routeProvider', function($routeProvider){
$routeProvider
.when('/',{
replace:true,
templateUrl: 'views/questions.html',
controller: 'SiteController as vm'
})
.when('/categories',{
templateUrl: 'views/categories.html',
controller: 'CategoriesCtrl as cm'
})
.when('/categories/:name*',{
templateUrl: 'views/questions.html',
controller: 'SiteController as vm'
})
.otherwise({
redirectTo: '/'
})
}]);
index.htmlを
<div class="col-xs-12 col-sm-8 col-md-8" ng-view>
All views load here
</div>
questions.html
<table class="table table-questions">
<thead>
</thead>
<tbody>
<tr dir-paginate-start="q in vm.allquestions>
<td>
<a class="questionlinks" ng-click="vm.viewquestion(q.idquestion)> {{q.question}} </a><h4></h4>{{q.date }}
</td>
<td class="text-center"><span class="box box-blue"> {{q.clicks}} </span></td>
</tr >
</tbody>
</table>
<div class="wrapper content content-categories content-tags" id="categories_content">
<h2>Categories</h2>
<div class="col-md-12">
<ul class="list-tags" ng-repeat="c in cm.categories">
<li><a ng-href="#/categories{{c.categoryurl}}" ng-click="cm.getCategoryQuestions(c.idcategory)">{{c.categoryname}}</a></li>
</ul>
</div>
<div class="col-md-12">
<nav>
</nav>
</div>
</div >
今コントローラ SiteController
(function() {
'use strict';
angular
.module('app')
.controller('SiteController', SiteController);
SiteController.$inject = ['$http','$route','$routeParams','$rootScope'];
function SiteController($http,$route,$routeParams,$rootScope) {
var vm = this;
vm.allquestions=[];
vm.thequestions=thequestions;
init();
function init(){
thequestions();
}
function thequestions() {
var url;
$rootScope.$on('updateQs',function(event, obj){
url=obj;
$http.get(url).then(function (response) {
vm.allquestions=response.data;
});
});
$http.get("/getlatestquestions").then(function (response) {
vm.allquestions=response.data;
});
}
}
})();
カテゴリーコントローラ
(function() {
'use strict';
angular
.module('app')
.controller('CategoriesCtrl', CategoriesCtrl);
CategoriesCtrl.$inject = ['$http','$rootScope'];
function CategoriesCtrl($http,$rootScope) {
var cm = this;
cm.categories=[];
cm.categoryquestions=[];
//CATEGORIES
cm.getCategories=getCategories;
cm.getCategoryQuestions= getCategoryQuestions;
init();
function init(){
getCategories();
}
//CATEGORIES RELATED
function getCategories() {
var url="/getcategories";
var categoryPromise=$http.get(url);
categoryPromise.then(function (response) {
cm.categories=response.data;
})
}
function getCategoryQuestions(idcategory) {
var url="/getcategoryquestions"+idcategory;
$rootScope.$emit('updateQs',url);
}
}
})();
工場の代替 を追加しました。このapp.configを下app.moduleファイル内
app.factory("newquestions", function() {
var questions = {};
return {
setQs: function (value) {
questions = value;
},
getQs: function() {
return questions;
}
};
});
この
(function() {
'use strict';
angular
.module('app')
.controller('SiteController', SiteController);
SiteController.$inject = ['$http','$route','$routeParams','newquestions'];
function SiteController($http,$route,$routeParams,newquestions) {
var vm = this;
vm.allquestions=[];
vm.thequestions=thequestions;
init();
function init(){
initial();
thequestions();
}
function initial(){
newquestions.setQs("/getlatestquestions");
}
function thequestions() {
var url=newquestions.getQs();
$http.get(url).then(function (response) {
vm.allquestions=response.data;
});
}
}
})();
このSiteController
でCategoriesController で(function() {
'use strict';
angular
.module('app')
.controller('CategoriesCtrl', CategoriesCtrl);
CategoriesCtrl.$inject = ['$http','newquestions'];
function CategoriesCtrl($http,newquestions) {
var cm = this;
cm.categories=[];
cm.categoryquestions=[];
//CATEGORIES
cm.getCategories=getCategories;
cm.getCategoryQuestions= getCategoryQuestions;
init();
function init(){
getCategories();
}
//CATEGORIES RELATED
function getCategories() {
var url="/getcategories";
var categoryPromise=$http.get(url);
categoryPromise.then(function (response) {
cm.categories=response.data;
})
}
function getCategoryQuestions(idcategory) {
var url="/getcategoryquestions"+idcategory;
newquestions.setQs(url);
}
}
})();
あなたが間違った方法でこれに近づいているような気がします。コントローラは、両方が同じ時間に**ページ上にある場合のみ**互いに通信することができます。一般的には、ページ遷移間でデータを保持するシングルトンであるサービスを使用するか、各遷移前にサーバーを更新するか、localstorage/cookieからデータ状態を格納および取得します。 – Claies