각도의 전역 변수JS

각도의 전역 변수JS

컨트롤러의 스코프에서 변수를 초기화하는 데 문제가 있습니다.그런 다음 사용자가 로그인하면 다른 컨트롤러에서 변경됩니다.이 변수는 탐색 모음과 같은 항목을 제어하는 데 사용되며 사용자 유형에 따라 사이트의 일부에 대한 액세스를 제한하므로, 이 변수가 그 가치를 유지하는 것이 중요합니다.문제는 초기화를 한 컨트롤러가 어떤 각도로 다시 호출된 후 변수를 초기값으로 리셋한다는 것입니다.

이것은 글로벌 변수를 선언하고 초기화하는 올바른 방법이 아니라고 생각합니다만, 실제로는 글로벌하지 않습니다.따라서 질문은 무엇이 올바른 방법이고 현재 버전의 angular에서 작동하는 좋은 예가 있는가 하는 것입니다.

기본적으로 "글로벌" 변수에는 다음 두 가지 옵션이 있습니다.

• $rootScope http://docs.angularjs.org/api/ng.$rootScopehttpdocs.angularjs.org/api/ng.$
• http://docs.angularjs.org/guide/services 서비스를 이용하다

$rootScope는 모든 범위의 부모이므로 여기에 공개된 값은 모든 템플릿 및 컨트롤러에 표시됩니다.「 」의 $rootScope는 컨트롤러에 삽입하여 이 범위에서 값을 변경할 수 있기 때문에 매우 간단합니다.편리할 수도 있지만 글로벌 변수의 모든 문제를 안고 있습니다.

서비스는 임의의 컨트롤러에 삽입하여 컨트롤러의 범위에서 그 값을 표시할 수 있는 싱글톤입니다.서비스는 아직 '글로벌'이지만, 사용 장소와 노출 장소를 훨씬 더 잘 제어할 수 있습니다.

서비스 사용은 조금 더 복잡하지만, 그 정도는 아닙니다.다음은 예를 제시하겠습니다.

var myApp = angular.module('myApp',[]);
myApp.factory('UserService', function() {
  return {
      name : 'anonymous'
  };
});

다음으로 컨트롤러에서 다음을 수행합니다.

function MyCtrl($scope, UserService) {
    $scope.name = UserService.name;
}

여기 jsFiddle이 있습니다.http://jsfiddle.net/pkozlowski_opensource/BRWPM/2/

프로바이더의 Angular 설명서에 따라 값을 저장하는 경우 Value 레시피를 사용해야 합니다.

var myApp = angular.module('myApp', []);
myApp.value('clientId', 'a12345654321x');

그런 다음 다음과 같은 컨트롤러에서 사용합니다.

myApp.controller('DemoController', ['clientId', function DemoController(clientId) {
    this.clientId = clientId;
}]);

Provider, Factory 또는 Service를 사용해도 같은 것을 얻을 수 있습니다.이는 "Provider Recipe 위에 구문설탕을 얹은 것"이기 때문입니다.그러나 Value를 사용하면 최소한의 구문만으로 원하는 것을 얻을 수 있습니다.

다른 은 '먹다'를 하는 것입니다.$rootScope다른 언어에서 글로벌 변수를 사용하지 않는 것과 같은 이유로 사용하면 안 되기 때문에 선택사항이 아닙니다.그것은 적게 사용하는 것이 좋습니다.

가 모음음음 에서 상속되기 $rootScope가 있는$rootScope.data 그 사실을 되는 거죠.data, 작성되어 있습니다.$scope.data로컬 스코프에서 문제가 발생합니다.

---

이 값을 수정하고 모든 컨트롤러에서 이 값을 유지하려면 개체를 사용하고 속성을 수정하십시오. Javascript는 "참조 복사본"에 의해 전달됩니다.

myApp.value('clientId', { value: 'a12345654321x' });
myApp.controller('DemoController', ['clientId', function DemoController(clientId) {
    this.clientId = clientId;
    this.change = function(value) {
        clientId.value = 'something else';
    }
}];

JSFiddle 예시

Angular를 한 AngularJS 변수"JS의 "JS"는 다음과 같이 입력합니다.$rootScope:

컨트롤러 1은 글로벌 변수를 설정합니다.

function MyCtrl1($scope, $rootScope) {
    $rootScope.name = 'anonymous'; 
}

컨트롤러 2는 글로벌 변수를 읽습니다.

function MyCtrl2($scope, $rootScope) {
    $scope.name2 = $rootScope.name; 
}

여기 jsFiddle이 있습니다.http://jsfiddle.net/natefriedman/3XT3F/1/

위키 풀에 다른 아이디어를 추가하려고 하는데, Angular는?JS와 모듈?저도 이제 막 사용하기 시작했는데, 제가 보기엔 이게 최선인 것 같아요.

주의: 작성 시점에서는 Angular 1.3.7이 최신 안정판입니다.이것들은 1.2.0에서 추가된 것 같습니다만, Changelog에서는 확인할 수 없습니다.

정의해야 하는 개수에 따라 개별 파일을 생성할 수 있습니다.하지만 저는 일반적으로 앱의 실행 직전에 이러한 항목을 정의합니다..config()쉽게 접근할 수 있도록 차단합니다.이러한 모듈은 여전히 효과적으로 모듈이기 때문에 종속성 주입에 의존해야 하지만 앱 모듈에서는 "글로벌"로 간주됩니다.

예를 들어 다음과 같습니다.

angular.module('myApp', [])
  .value('debug', true)
  .constant('ENVIRONMENT', 'development')
  .config({...})

다음으로 컨트롤러 내부:

angular.module('myApp')
  .controller('MainCtrl', function(debug, ENVIRONMENT), {
    // here you can access `debug` and `ENVIRONMENT` as straight variables
  })

첫 번째 질문부터 말하자면, 여기서는 정적 특성이 가변(값) 또는 최종(정수)으로 요구되고 있는 것처럼 들립니다.제 개인적인 의견입니다만, 실행 시 설정 항목을 배치되어 있습니다.$rootScope★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★

// app.js or break it up into seperate files
// whatever structure is your flavor    
angular.module('myApp', [])    

.constant('CONFIG', {
    'APP_NAME' : 'My Awesome App',
    'APP_VERSION' : '0.0.0',
    'GOOGLE_ANALYTICS_ID' : '',
    'BASE_URL' : '',
    'SYSTEM_LANGUAGE' : ''
})

.controller('GlobalVarController', ['$scope', 'CONFIG', function($scope, CONFIG) {

    // If you wish to show the CONFIG vars in the console:
    console.log(CONFIG);

    // And your CONFIG vars in .constant will be passed to the HTML doc with this:
    $scope.config = CONFIG;
}]);

HTML의 경우:

<span ng-controller="GlobalVarController">{{config.APP_NAME}} | v{{config.APP_VERSION}}</span>

localStorage.username = 'blah'

최신 브라우저에 접속할 수 있다면.하지만 당신의 가치관은 모두 문자열로 바뀔 것입니다.

새로고침 사이에 캐시된다는 편리한 이점도 있습니다.

Angular 2.되었을 때, 저는 않습니다. Angular 2.0이 출시되었을 때.$rootScope은 ...라는 사실에 하고 있다.라는 사실에 기초하고 있다.$scope거거중중중중다다아직 , 컨트롤러는 하지 않습니다.ng-controller하는 것을 .대신 명령어에 컨트롤러를 주입하는 것을 고려해 보십시오.1번입니다.X에서 2.0으로 전환하는 시간을 단축하려면 서비스를 글로벌 변수로 사용하는 것이 가장 좋습니다.

환경 변수를 사용할 수도 있습니다.$window컨트롤러 외부에서 글로벌 변수 선언을 체크할 수 있도록 하기 위해$watch

var initWatch = function($scope,$window){
    $scope.$watch(function(scope) { return $window.globalVar },
        function(newValue) {
            $scope.updateDisplayedVar(newValue);
    });
}

단, 이러한 글로벌 값을 사용하면 다이제스트 사이클이 길어지기 때문에 항상 실시간 업데이트가 되는 것은 아닙니다.이 설정으로 다이제스트 시간을 조사할 필요가 있습니다.

실수로 다른 방법을 찾았습니다.

내가 한 일은...var db = null위의 앱 선언을 수정한 후app.js그 후, 제가 접속했을 때,controller.js문제없이 접속할 수 있었습니다.이 방법에는 제가 모르는 문제가 있을 수 있지만, 좋은 해결책이라고 생각합니다.

을 사용해 보세요..$rootScope컨트롤러에 있습니다.

app.run(function($rootScope) {
    $rootScope.Currency = 'USD';
});

구성 블록에서는 $rootScope 서비스를 사용할 수 없기 때문에 실행 블록에서만 사용할 수 있습니다.

(어차피 Angular 2+를 사용한다면) 꽤 쉬워요.

간단하게 추가

declare var myGlobalVarName;

컴포넌트 파일의 상단에서("가져오기" 문 뒤에 있는 경우 등), 컴포넌트 내부의 어느 장소에서도 「MyGlobalVarName」에 액세스 할 수 있습니다.

당신은 또한 이런 것을 할 수 있습니다.

function MyCtrl1($scope) {
    $rootScope.$root.name = 'anonymous'; 
}

function MyCtrl2($scope) {
    var name = $rootScope.$root.name;
}

언급URL : https://stackoverflow.com/questions/11938380/global-variables-in-angularjs