создание Scope и Batarang

Рассмотрим следующий пример:создание Scope и Batarang

HTML

<!DOCTYPE html> 
<html ng-app="myApp"> 
<head> 
<script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.1/angular.min.js"></script> 
<meta charset=utf-8 /> 
<title>Exploring directives</title> 
</head> 
<body> 

    <my-directive> 
    Some text 
    </my-directive> 
    {{Info.Version}} 
    <script type="text/ng-template" id='my-directive.html'> 
    <div>Hello, {{Info.Version}}</div> 
    </script> 
</body> 
</html>

var app = angular.module('myApp', []); 
app.run(function($rootScope) { 
    $rootScope.Info = {}; 
    $rootScope.Info.Name = 'rootScope'; 
    $rootScope.Info.Version = '1.0.0.1'; 
}); 
app.directive('myDirective', function() { 
    return {  
    restrict: 'E', 
    templateUrl: 'my-directive.html', 
    scope: false 
    }; 
});

Batarang

enter image description here

Из того, что я видел, никогда не отображается $ rootScope (но я предполагаю, что это будет маркирован Scope (001), если он был).

Когда я изменить область, чтобы верно в JS:

app.directive('myDirective', function() { 
    return {  
    restrict: 'E', 
    templateUrl: 'my-directive.html', 
    scope: true 
    }; 
});

Это появляется что $ rootScope выталкивается вниз Scope (002):

enter image description here

Может кто-нибудь объяснить, что происходит? Почему выглядит $ rootScope? Что над ним тогда? Вот jsbin ссылка: http://jsbin.com/udALigA/1/

источник

2014-01-31 Mike Cheel

Вы когда-нибудь понять, почему rootScope не появляется, или почему он показывает с идентификатором 002 вместо 001? – JohnGalt

Еще не хотел услышать ответ. –

обычно директивы создавать свои собственные scope (в данном случае Scope (002)), но при установке scope: true в myDirective он унаследует scope родительского элемента.

По крайней мере, это то, что я предполагаю, происходит здесь, поскольку я никогда раньше не видел, чтобы это делалось так. Обычно вы будете использовать возможности для определения некоторых переменных в пределах вашей директивы, чтобы вы могли передать параметры с HTML тэгом как так:

<my-directive someVar="true"> 
    Some text 
</my-directive>

тогда вы могли бы вытащить значение someVar в директиве, используя:

scope: { 
    someVar: '@' //or '=' if you wanted two-way binding 
}

, то вы можете использовать someVar в контроллере, который вы связали с директивой.

более распространенный способ сноса сферу родительского элемента с помощью transclude назначения в директиве:

transclude: true

источник

2014-06-02 14:49:13 Ganonside

ответ

Смежные вопросы