Угловой: Pass переменной директиве

Question

Я ищу передать переменную из контроллера в директиве я создал:

HTML

<div class="dropup inline-block" ng-repeat="event in video.events"> 
    <event video="video"></event> 
</div> 

ДИРЕКТИВА

.directive("event", function() { 
    return { 
     restrict: "E", 
     replace: true, 
     scope:{ 
     video: '=videoObject' 
     }, 
     template: '<a class="btn btn-default event-margin" ng-style="{color: video.iconColor, float: floatEvents}" type="button" data-title="{{event.title}}"><span class="fa fa-fw {{event.icon}}"></span></a>', 
     link: function(scope, elm, attrs) { 
     elm 
     .on('mouseenter', function() { 
      elm.css('background-color', scope.video.color); 
      elm.css('color','#FFFFFF'); 
     }) 
     .on('mouseleave', function() { 
      elm.css('background-color','#FFFFFF'); 
      elm.css('color', scope.video.color); 
     }); 
     } 
    }; 

Проблема заключается в том, когда я добавляю область в возвращаемом dict атрибут перестает работать.

Итак, идея состоит в том, чтобы изменить цвет элемента при передаче мыши на элементе со значением video.color, переменной в $ scope контроллера.

Я искал ответ на другие должности, но они не работают:

• Passing variable from controller scope to directive
• Easiest way to pass an AngularJS scope variable from directive to controller?

Answer 1

Хорошо, я нашел решение, video - это переменная области действия контроллера. Установка области действия в false в возвращаемом dict позволяет директиве получить доступ к области контроллера.

В этой сети объясняется: https://www.undefinednull.com/2014/02/11/mastering-the-scope-of-a-directive-in-angularjs/

Когда Прицел установлен на «истинный», AngularJS создаст новую область путем наследования родительской области (обычно контроллер сферы, в противном случае приложения rootScope). Любые изменения, внесенные в эту новую область, не отразятся на родительской области. Однако, поскольку новая область наследуется от родительской области, любые изменения, сделанные в Ctrl1 (родительская область), будут отражены в области директивы.

Когда scope установлен в значение «false», контроллер Ctrl1 и директива используют один и тот же объект области видимости. Это означает, что любые изменения контроллера или директивы будут синхронизированы.

Answer 2

Если видео объект затем добавить video: '=video',
Если видео представляет собой строку, затем добавить video: '@video'

.directive("event", function() { 
    return { 
     restrict: "E", 
     replace: true, 
     scope:{ 
     video: '=video' 
     }, 
     template: '<a class="btn btn-default event-margin" ng-style="{color: video.iconColor, float: floatEvents}" type="button" data-title="{{event.title}}"><span class="fa fa-fw {{event.icon}}"></span></a>', 
     link: function(scope, elm, attrs) { 
     elm 
     .on('mouseenter', function() { 
      elm.css('background-color', scope.video.color); 
      elm.css('color','#FFFFFF'); 
     }) 
     .on('mouseleave', function() { 
      elm.css('background-color','#FFFFFF'); 
      elm.css('color', scope.video.color); 
     }); 
     } 
    };