html에서 rootScope 변수 사용
따라서 angular html에서는 스코프 변수를 다음과 같이 쉽게 사용할 수 있습니다.
<!doctype html>
<html ng-app>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script>
</head>
<body>
<div>
<label>Name:</label>
<input type="text" ng-model="yourName" placeholder="Enter a name here">
<hr>
<h1>Hello {{yourName}}!</h1>
</div>
</body>
</html>
예를 들어 다음과 같습니다.
<h1>Hello {{yourName}}!</h1>
사용하고 있다yourName내가 하고 싶었던 범위에서:
<h1>Hello {{yourName}} you are in in {{$rootScope.zoneName}}!</h1>
가지고 갈 수 있나요?$rootScope변수를 사용할 수 있을까요?
지정할 필요가 없습니다.$rootScopehtml로 지정합니다.사용하는 방법과 동일하게 사용할 수 있습니다.$scope변수
업데이트만 하면 됩니다.
<h1>Hello {{yourName}} you are in in {{$rootScope.zoneName}}!</h1>
로.
<h1>Hello {{yourName}} you are in in {{zoneName}}!</h1>
이 조작은 유효합니다.
<h1>Hello {{yourName}} you are in in {{$root.zoneName}}!</h1>
주사할 수도 있고$rootScope이러한 스코프 변수에 매핑합니다.
$scope.global = $rootScope;
그러면 템플릿에서
<p>$rootscope value of name is {{ global.name }}.</p>
쓸데없이 물건을 넣지 않도록 주의해야 합니다.$rootScope코드를 변조하는 것은 베스트 프랙티스로 간주되지 않기 때문에
늦은 건 알지만, 좋은 설명이 필요해!
Angular 1.x 월드의 모든 뷰에는 자동으로 새로운 $scopesuch $scope가 $rootScope라고 불리는 것부터 확장됩니다.따라서 로컬 $scope는 $rootScope가 저장하고 있는 모든 것을 상속하고 해당 데이터에 대한 자체 버전을 가집니다.
따라서 $rootScope 레벨에 정보가 있는 경우 기본적으로 해당 정보가 제공되므로 뷰는 일반적인 보간법을 사용하여 직접 액세스할 수 있습니다.
이 코드 행은 방법을 보여줍니다!
var app = angular.module('plunker', []);
app.run(function($rootScope) {
$rootScope.persons = [
{
name : "Houssem",
role : "Developer Advocate"
},
{
name: "Clark",
role: "Developer"
}
];
})
app.controller('MainCtrl', function($scope) {
$scope.greetings = 'Hello World !';
});
색인 페이지에는 다음과 같은 내용이 있습니다.
<!DOCTYPE html>
<html ng-app="plunker">
<head>
<meta charset="utf-8" />
<title>AngularJS Plunker</title>
<link rel="stylesheet" href="style.css" />
<script data-require="angular.js@1.0.x" src="https://code.angularjs.org/1.0.8/angular.js" data-semver="1.0.8"></script>
<script data-require="ui-router@1.0.0-alpha.5" data-semver="1.0.0-alpha.5" src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-router/1.0.0-alpha.5/angular-ui-router.js"></script>
<script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
<p>{{greetings}}</p>
<ul>
<li ng-repeat="person in persons">
<p>{{person.name}} - {{person.role}}</p>
</li>
</ul>
</body>
</html>
그리고 그것을 설명하는 이 플런커를 체크해 주세요!
제 경우, 이 기능을 사용할 때 작동하지 않았습니다.rootscope직접 변수를 지정합니다.$root와 함께 사용해야 했습니다.
코드는 다음과 같습니다.
<h1>you are in in {{$root.zoneName}}!</h1>
언급URL : https://stackoverflow.com/questions/31707789/use-rootscope-variables-in-my-html
'source' 카테고리의 다른 글
| MongoDB GUI 클라이언트(크로스 플랫폼 또는 Linux) (0) | 2023.02.16 |
|---|---|
| 오류: ORA-01704: 문자열 리터럴이 너무 깁니다. (0) | 2023.02.16 |
| Mongoid 설치 후 Active Record 생성기를 사용하시겠습니까? (0) | 2023.02.16 |
| 라벨의 Angular.js ng-click 이벤트가 두 번 발생합니다. (0) | 2023.02.16 |
| 대응: '리다이렉트'는 'react-router-dom'에서 내보내지 않습니다. (0) | 2023.02.16 |