变量名为searchText
,它将由用户在搜索框中输入
<input type="text" class="form-control" ng-model="searchText" placeholder=" Type KvK-nummer and Press Enter" id="typehead">
示例网址:http://localhost:8091/odata/dll-poc-dv/Account('41-125061-0000') //in brackets is the searchTeaxt
我想要实现的是保持searchText的值并在2个不同的控制器中使用以传递URL中的searchText来接收数据。所以我在服务中获取变量并与2个控制器共享该服务:
angular.module('serviceModule',[])
.factory('dataService',['$http', dataService]);
function dataService($http,$rootScope,$scope){
return{
getSearchText:getSearchText,
setSearchText: setSearchText,
getMainData: getMainData
};
var searchText;
function setSearchText(value){
searchText = value;
};
function getSearchText(){
return searchText;
};
function getMainData(id){
return $http.get("http://localhost:8091/odata/dll-poc-dv/Account(kvk='"+id+"')").then(
function (result){ console.debug(result);return result.data.d.results})
};
$scope.$watch('searchText',function(newVal,oldVal){
console.log(newVal,oldVal);
})
};
第一控制器:
angular.module('mainPage',['serviceModule'])
.controller('MainCtrl',['$scope', '$http','dataService', function ($scope, $http,dataService) {
dataService.setSearchText($scope.searchText);
$scope.getMainData = function(kvk){
$scope.getMainData = function(){
dataService.getMainData($scope.searchText).then(function(data){
$scope.getData= data;
})
};
}]);
第二名管制员:
angular.module('profileDetail',['serviceModule'])
.controller('ProfileCtrl', ['$scope','$filter','$http','$q','$routeParams','dataService','moment',function($scope,$filter,$http,$q,$routeParams,dataService,moment){
// initial grab of the right data
function init (){
var searchText = dataService.getSearchText();
dataService.getMainData(searchText).then(function(data){
$scope.getData = data;
});
}
init();
}]);
答案 0 :(得分:5)
为什么不在服务中实际保存变量?由于该服务是单个实例,因此您可以跨控制器访问该变量。
angular.module('app')
.factory('dataService',['$http', dataService]);
function dataService($http,$rootScope,$scope){
var searchText = "";
function setSearchText(value) {
searchText = value;
}
function getSearchText() {
return searchText;
}
return{
setSearchText: setSearchText,
getSearchText: getSearchText
};
};
这种方式可以在1个控制器中设置变量,然后使用服务方法在另一个控制器中访问它,不需要继续使用任何rootScope。
因此,在控制器A 中,您可以先设置变量 -
(function (angular) {
'use strict';
angular.module('app')
.controller('ControllerA', ['dataService', ControllerA]);
function ControllerA(dataService) {
var vm = this;
// Set the variable from this controller
dataService.setSearchText("blabla");
};
})(window.angular);
然后在控制器B -
中访问它(function (angular) {
'use strict';
angular.module('app')
.controller('ControllerB', ['dataService', ControllerB]);
function ControllerB(dataService) {
var vm = this;
// Set the variable from this controller
var searchText = dataService.getSearchText();
};
})(window.angular);