В Angular, как поделиться контроллером директивы с его дочерним содержимым (когда transclude имеет значение true)?

Question

В Angular, как поделиться контроллером директивы с его дочерним содержимым (когда transclude имеет значение true)?

0

Я попытался найти ссылки на SO. Но не удовлетворены ответами. Я новичок в Angular. Я пытаюсь добиться перехода, создав такую директиву:

app.directive('wrapperDirective',function(){        
        return{            
            restrict :'E',           
            controller:'wrapperCtrl',
            template :'<div class="widget-template" ng-transclude></div>',
            transclude: true,
            replace:true,
            scope:{              
              cityList : '='
            }            
        }        
    });

app.controller('wrapperCtrl', ['$scope',function($scope, $rootScope){
        $scope.citynames = $scope.cityList;
});




<wrapper-directive cityList="Bangalore">    
     <div>{{ citynames  }}</div>
 </wrapper-directive>

Теперь как сделать данные доступными объявленными как атрибут для дочернего контента. Я действительно смущен, пожалуйста, помогите.

Ameer Khan 07 июнь 2016, в 17:57

Источник

Теги:

javascript

angularjs

angularjs-scope

angularjs-directive

angularjs-ng-transclude

1 ответ

Ещё вопросы

jeremy-denis · Answer 1 · 2016-06-07T16-42-00.000Z

Будьте в курсе, когда вы используете область действия и директиву, которую вы можете перепутать из-за того, что контроллер может иметь собственный объем.

Другой способ сделать это - использовать контроллер в качестве синтаксиса. Просто объявлено в вашем контроллере что-то вроде:

function myController($scope) {
    var vm = this;
    vm.yourAttribute = value;
}

Подобно этому вы можете получить доступ к своим атрибутам контроллера, используя

 wrapperCtrl.yourAttribute

И если запись wrapperCtrl.yourAttributes слишком длинная, вы можете использовать контроллер атрибутов так, как wrapperCtrl.yourAttributes ниже.

app.directive('wrapperDirective',function(){        
        return{            
            restrict :'E',           
            controller:'wrapperCtrl',
            controllerAs: 'yourname',
            template :'<div class="widget-template" ng-transclude></div>',
            transclude: true,
            replace:true,
            scope:{              
              cityList : '='
            }            
        }    


});

только для того, чтобы использовать yourname.yourAttribute когда вы хотите получить доступ к атрибутам