Javascript 如何让多个Angular JS路由共享一个控制器实例?
我有一个angular JS应用程序,它有一个介绍页面和一个“工作”页面。。 my html的简化版本如下所示:Javascript 如何让多个Angular JS路由共享一个控制器实例?,javascript,angularjs,Javascript,Angularjs,我有一个angular JS应用程序,它有一个介绍页面和一个“工作”页面。。 my html的简化版本如下所示: (函数(){ "严格使用",; var MyController=函数(u,$rootScope,$scope,$location,$anchorScroll,$timeout,gettextCatalog,service){ var self=这个; 控制台日志(“测试”); //更多调用http请求的代码 }; angular.module('my.controller',['
(函数(){
"严格使用",;
var MyController=函数(u,$rootScope,$scope,$location,$anchorScroll,$timeout,gettextCatalog,service){
var self=这个;
控制台日志(“测试”);
//更多调用http请求的代码
};
angular.module('my.controller',['gettext','lodash','ngRoute','ngSanitize','ngAnimate','my.service']).config(
函数($routeProvider){
$routeProvider.when(“/”{
“templateUrl”:“modules/home.html”,
“重新加载搜索”:false
})。当(“/聊天”时{
“templateUrl”:“modules/working.html”,
“重新加载搜索”:false
});
}).controller(“MyController”,MyController);
}());代码>
电影院里有什么
定义路线时,您始终可以通过控制器
$routeProvider.when('/', {
'templateUrl': 'modules/home.html',
'controller' : MyController,
'reloadOnSearch': false
}).when('/chatting', {
'templateUrl': 'modules/working.html',
'controller' : MyController,
'reloadOnSearch': false
});
绑定到控制器的每个视图都会创建该控制器自己的实例。控制器仅由视图继承共享,也就是说,子视图将有权访问父控制器的同一实例
然而,这似乎不是你想要做的。听起来您想要做的是在控制器实例之间持久化某些数据(通过http请求获取)的状态。在这种情况下,您可能想要做的是将请求逻辑移动到服务(或工厂)中,然后将该服务注入控制器。由于服务在角度上是单例的,您的请求现在应该只执行一次
例如:
var MyController = function (_, $rootScope, $scope, $location, $anchorScroll, $timeout, gettextCatalog, service, yourHttpService) {
var self = this;
console.log("test");
// get data from your http service here... perhaps $scope.data = yourHttpService.getData(...).then(...);
};
.factory('yourHttpService', function($http, $q) {
var dataCache = ...; // create a local memory db to store the data
return {
getData: function(...) {
var deferred = $q.defer();
// check to see if the data is already cached, if so resolve the promise with the cached data
// if data is not cached, perform the $http request to fetch the data, then cache it and resolve your promise
return deferred.promise;
};
};
});