Zastosowanie rootScope zmienne w moim html

Więc możemy używać zmiennych zakresie w naszym kątowej html łatwo tak:Zastosowanie rootScope zmienne w moim 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>

Tak na przykład:

<h1>Hello {{yourName}}!</h1>

Czy korzystanie yourName z zakresu ja ufałem zrobić:

<h1>Hello {{yourName}} you are in in {{$rootScope.zoneName}}!</h1>

Czy jest możliwe zebranie $rootScope zmiennych w l Czy to jest?

Źródło

2015-07-29 yatg

Nie trzeba określać $rootScope w html. Można go używać w taki sam sposób, jak używać $scope zmienne

wystarczy zaktualizować z

<h1>Hello {{yourName}} you are in in {{$rootScope.zoneName}}!</h1>

<h1>Hello {{yourName}} you are in in {{zoneName}}!</h1>

Źródło

2015-07-29 17:59:07 nikhil

Dziękuję Nikhil, nie wiedziałem o tym!Testuję od razu! :) Czy to samo dotyczy, jeśli chcę wstawić zmienne z '$ route.current.params'? – yatg

@ yatg - Czy próbowałeś? – nikhil

Próbuję, ale mam gdzieś błąd, który wyłącza aplikację Im próbuję znaleźć haha – yatg

To powinno działać:

<h1>Hello {{yourName}} you are in in {{$root.zoneName}}!</h1>

Źródło

2015-07-29 18:01:13 GPicazo

Dziękuję Gpicazo! woudl sama praca dla '{{$ route.current.params}}'? – yatg

@ yatg Nie wierzę w to. Możesz jednak (1) wprowadzić $ stateParams do kontrolera (2) ustawić zmienną zasięgu, taką jak $ scope.param = $ stateParams.param; i (3) wiążą zmienną zasięgu w widoku: {{param}}. – GPicazo

zobacz http://stackoverflow.com/questions/22216441/what-is-the-difference-between-scope-root-and-rootscope for explanation –

można wstrzykiwać $rootScope w kontroler, a następnie zmapuj go na zmienną zakresu, taką jak ta

$scope.global = $rootScope;

następnie w szablonie można użyć

<p>$rootscope value of name is {{ global.name }}.</p>

Trzeba być ostrożnym, aby nie bezużytecznie umieścić rzeczy do $rootScope jak to nie jest uważane za najlepsze praktyki modulować swój kod

Źródło

2015-07-29 18:02:34 zeachco

Wiem, że jest późno, ale potrzebne jest dobre wytłumaczenie!

Wszelkie Zobacz w Kątowymi 1.x świat będzie miał automatycznie i domyślnie nowy $ zakres takie $ zakres zostanie przedłużony z czegoś nazywany $ rootScope więc lokalny $ będzie zakres dziedziczą wszystko, co przechowywane jest w pamięci podręcznej $ i będą miały własną wersję tych danych.

Więc jeśli masz jakieś informacje na poziomie $ rootScope, będziesz mieć to domyślnie, więc twój widok będzie mógł uzyskać do niego bezpośredni dostęp przy użyciu zwykłej interpolacji.

Ta linia kodu pokaże, jak też!

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 !'; 
});

I to na stronie indeksu:

<!DOCTYPE html> 
<html ng-app="plunker"> 

<head> 
<meta charset="utf-8" /> 
<title>AngularJS Plunker</title> 
<link rel="stylesheet" href="style.css" /> 
<script data-require="[email protected]" src="https://code.angularjs.org/1.0.8/angular.js" data-semver="1.0.8"></script> 
<script data-require="[email protected]" 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>

I proszę sprawdzić ten Plunker które wyjaśniają tylko!

Źródło

2016-07-31 09:51:53

Zastosowanie rootScope zmienne w moim html

Odpowiedz

Powiązane problemy