Angular에서 $rootScope를 사용하여 변수를 저장하는 방법은 무엇입니까?
제가 어떻게 이용합니까$rootScope
변수를 컨트롤러에 저장하기 위해 나중에 다른 컨트롤러에 액세스합니다.예를 들어 다음과 같습니다.
angular.module('myApp').controller('myCtrl', function($scope) {
var a = //something in the scope
//put it in the root scope
});
angular.module('myApp').controller('myCtrl2', function($scope) {
var b = //get var a from root scope somehow
//use var b
});
이거 어떻게 해요?
루트 스코프에서 설정된 변수는 프로토타입 상속을 통해 컨트롤러 범위에서 사용할 수 있습니다.
다음은 @Nitish의 데모를 조금 더 명확하게 하기 위한 수정 버전입니다.http://jsfiddle.net/TmPk5/6/
모듈이 초기화되면 rootScope의 변수가 설정되고 상속된 각 스코프가 개별적으로 설정할 수 있는 자체 복사본을 얻는 것에 유의하십시오.change
기능).또한 rootScope의 값도 갱신할 수 있습니다(changeRs
에서 기능하다.myCtrl2
)
angular.module('myApp', [])
.run(function($rootScope) {
$rootScope.test = new Date();
})
.controller('myCtrl', function($scope, $rootScope) {
$scope.change = function() {
$scope.test = new Date();
};
$scope.getOrig = function() {
return $rootScope.test;
};
})
.controller('myCtrl2', function($scope, $rootScope) {
$scope.change = function() {
$scope.test = new Date();
};
$scope.changeRs = function() {
$rootScope.test = new Date();
};
$scope.getOrig = function() {
return $rootScope.test;
};
});
컨트롤러 간의 데이터 공유는 공장/서비스가 매우 좋은 이유입니다.한마디로 이렇게 동작합니다.
var app = angular.module('myApp', []);
app.factory('items', function() {
var items = [];
var itemsService = {};
itemsService.add = function(item) {
items.push(item);
};
itemsService.list = function() {
return items;
};
return itemsService;
});
function Ctrl1($scope,items) {
$scope.list = items.list;
}
function Ctrl2($scope, items) {
$scope.add = items.add;
}
이 바이올린에서는, http://jsfiddle.net/mbielski/m8saa/ 의 동작 예를 참조할 수 있습니다.
angular.module('myApp').controller('myCtrl', function($scope, $rootScope) {
var a = //something in the scope
//put it in the root scope
$rootScope.test = "TEST";
});
angular.module('myApp').controller('myCtrl2', function($scope, $rootScope) {
var b = //get var a from root scope somehow
//use var b
$scope.value = $rootScope.test;
alert($scope.value);
// var b = $rootScope.test;
// alert(b);
});
$syslog.value = $rootScope.test를 수행할 이유를 찾을 수 없습니다.
$scope는 이미 $rootScope에서 상속된 프로토타입입니다.
이 예를 참조해 주세요.
var app = angular.module('app',[]).run(function($rootScope){
$rootScope.userName = "Rezaul Hasan";
});
이제 이 범위 변수를 앱 태그의 아무 곳에나 바인딩할 수 있습니다.
먼저 $rootScope에 값을 저장합니다.
.run(function($rootScope){
$rootScope.myData = {name : "nikhil"}
})
.controller('myCtrl', function($scope) {
var a ="Nikhilesh";
$scope.myData.name = a;
});
.controller('myCtrl2', function($scope) {
var b = $scope.myData.name;
)}
$rootScope는 모든 $scope의 상위이며, 각 $scope는 $rootScope 데이터 복사본을 수신하고 $scope 자체를 사용하여 액세스할 수 있습니다.
"다른 컨트롤러에 액세스"만 있는 경우 각도 상수를 사용할 수 있습니다.이것에 의해, 애플리케이션 전체에서 액세스 하고 싶은 글로벌 설정이나 그 외의 것을 추가할 수 있습니다.
app.constant(‘appGlobals’, {
defaultTemplatePath: '/assets/html/template/',
appName: 'My Awesome App'
});
그리고 나서 다음과 같이 액세스 방법은 다음과 같습니다.
app.controller(‘SomeController’, [‘appGlobals’, function SomeController(config) {
console.log(appGlobals);
console.log(‘default path’, appGlobals.defaultTemplatePath);
}]);
(테스트 안 함)
상세정보 : http://ilikekillnerds.com/2014/11/constants-values-global-variables-in-angularjs-the-right-way/
http://astutejs.blogspot.in/2015/07/angularjs-what-is-rootscope.html
app.controller('AppCtrl2', function ($scope, $rootScope) {
$scope.msg = 'SCOPE';
$rootScope.name = 'ROOT SCOPE';
});
이를 실현하는 방법은 여러 가지가 있습니다.
1. 추가$rootScope
에.run
방법
.run(function ($rootScope) {
$rootScope.name = "Peter";
});
// Controller
.controller('myController', function ($scope,$rootScope) {
console.log("Name in rootscope ",$rootScope.name);
OR
console.log("Name in scope ",$scope.name);
});
2. 하나의 서비스를 생성하여 양쪽 컨트롤러에서 접근합니다.
.factory('myFactory', function () {
var object = {};
object.users = ['John', 'James', 'Jake'];
return object;
})
// Controller A
.controller('ControllerA', function (myFactory) {
console.log("In controller A ", myFactory);
})
// Controller B
.controller('ControllerB', function (myFactory) {
console.log("In controller B ", myFactory);
})
언급URL : https://stackoverflow.com/questions/18880737/how-do-i-use-rootscope-in-angular-to-store-variables
'source' 카테고리의 다른 글
Woocommerce - woocommerce_locate_template 대체 수단 (0) | 2023.02.22 |
---|---|
Contact Form 7에서 스판 래퍼를 제거하려면 어떻게 해야 합니까? (0) | 2023.02.22 |
인터페이스의 TypeScript 옵션 함수 (0) | 2023.02.22 |
리액트 앱에서 npm start를 실행할 때 babel-jest 의존성 문제 (0) | 2023.02.22 |
Oracle SQL에서 특정 문자까지 서브스트링을 선택하는 방법 (0) | 2023.02.22 |