Наряду с элементом Transclude, могу ли я передать его область тоже директиве?

Question

момент я чувствовал, я достаточно понял, о Transclude я наткнулся на это заявление:

Transclude allows us to pass in an entire template, including its scope, to a directive. 
Doing so gives us the opportunity to pass in arbitrary content and arbitrary scope to a directive. 

Означает ли это, если есть область применения прилагается к Transclude элемент, и он может быть передан в директиве? Если это правда, тогда я не могу получить доступ к этому свойству scope внутри шаблона директивы.

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

JSFiddle Link

Моя директива directive-box и transclude: true определяется в директиве Определение объекта (DDO).

В настоящее время существует Ребенок Див, который является элементом, чтобы быть

включены через

<div ng-controller='TransCtrl'>Inside Transclude Scope : {{name}}</div> 

и имеет контроллер TransCtrl прилагается к нему.

Теперь я пытаюсь получить доступ к $scope.name собственности, которая является частью TransCtrl от уровня директивы после определения этого в DDO:

scope: { 
     title: '@directiveTitle', 
     name: '=' 
     } 

Возможно ли это?

Это больше похоже на область родительского контроля, пытающуюся получить доступ к объекту «Область видимости», разрешено ли это в прототипическом наследовании JavaScript? Или есть что-то еще, что мне нужно знать?

Если это невозможно, что означает первое утверждение?

Transclude allows us to pass in an entire template, including its scope, to a directive. 

UPDATE 1:

Мой основной проблемой является контроллер должен оставаться с Transclude элементом, тем не менее мы должны быть в состоянии передать его (Transclude элемент) объем директивы, а затем Директива должна быть в состоянии потреблять это область, т.е. name from TransCtrl controller.

<div ng-controller='TransCtrl'>Inside Transclude Scope : {{name}}</div> 

Выше строки кода должны оставаться такими, как есть.

Возможно, я полностью ошибаюсь в своем вопросе, но, пожалуйста, позвольте мне, если это может быть выполнено.

Answer 1

Ответ на этот вопрос: https://jsfiddle.net/marssfa4/4/?

В нем я создал новый контроллер снаружи (эффективно заменив функциональность вашего rootScope внутри директивы), и я установил контроллер директивы в свой шаблон контроллера.

Долгий и короткий, хотя вы можете видеть, что можно перевести html вместе с его областью даже в директиву с ее собственной областью.

Этот HTML:

<div ng-app='myApp' ng-controller="OutsideScope"> 
    <h1>{{externalWorld}}</h1> 
    <div directive-box directive-title='{{directiveWorld}}' name='name'> 
    <div>Inside Transclude Scope : {{name}}</div> 
    </div> 
</div> 

JS (включает в себя обновление 1):

angular.module('myApp', []) 
    .directive('directiveBox', function() { 
    return { 
     restrict: 'EA', 
     scope: { 
     title: '@directiveTitle', 
     name: '=' 
     }, 
     transclude: true, 
     template: '<div ng-controller="TransCtrl">\ 
     <h2 class="header">{{ title }}</h2>\ 
       <div class="dirContent">Directive Element</div>\ 
       <div>Outside Transclude Scope : {{name}}</div>\ 
       <div class="content" ng-transclude></div>\ 
      </div>' 
    } 
    }) 
    .controller('TransCtrl', function($scope) { 
    $scope.name = 'Transclude World' 
    }) 
    .controller('OutsideScope', function($scope) { 
    $scope.name = 'External World' 
    }) 
    .run(function($rootScope) { 
    $rootScope.externalWorld = 'External World', 
     $rootScope.directiveWorld = 'Here comes directive' 
    }); 

ОБНОВЛЕНИЕ 1: JSFIDDLE

Я восстановил первоначальные декларации области как scope: false было ошибкой ,

Если я правильно понимаю ваш комментарий, вы хотите оставить контроллер на элементе, который должен быть переведён, но все еще есть {{name}} внутри этого элемента, игнорировать его непосредственный контроллер и использовать в качестве контроллера его родительскую (то есть директиву) область.

Причина, по которой я поставил контроллер в директиве шаблона, заключается в том, что это единственный способ ограничить область действия директивы директивой, а не ее исключенными элементами. Если вы явно размещаете контроллер на элементе, то независимо от того, содержится ли он в директиве с другой областью, ее ближайшая область переопределит ту область, которая была объявлена ​​в директиве. Другими словами, независимо от того, что сфера применения Директивы является, {{name}} в

<div ng-controller='TransCtrl'>Inside Transclude Scope : {{name}}</div>

Всегда будет то, что $scope.name в TransCtrl.

Answer 2

Проблема заключается в том, что контроллер определен в ng-transcluded html.

Я сделал это более ясным, используя

1. bindToController построить
2. с помощью контроллера на уровне директивы

См this скрипку рабочего примера.

controllerAs: "TransCtrl", 
bindToController: true 

И ваше утверждение: «Родительский прицел, пытающийся получить доступ к объекту« Область видимости »неверен правильно? Поскольку мы пытаемся использовать свойство родительской видимости, то есть имя из дочернего элемента (ng-transcluded content), что возможно с протипичным наследованием, а не наоборот.