AngularJS - Доступ к контроллеру сторонней директивы

Question

Я пытаюсь использовать Search-Filter из UI Framework LumX в том, что я признаю, что это не традиционное использование.

Предполагаемый способ работы фильтра - нажать кнопку увеличительного стекла, opens; вызывает метод openInput на контроллере. Щелчок мышью закрывает его.

Тем не менее, я хочу продлить это на opening и closing ввода при нажатии на toolbar__label span, но мои знания Angular просто не в порядке.

Мой HTML выглядит

<div class="toolbar" opensearch> 
    <span class="toolbar__label fs-title ml black__text" >{{ "content.search.tip" | translate }}</span> 
    <div class="toolbar__right"> 
    <lx-search-filter lx-width="400" lx-closed="true" > 
     <input type="text" ng-model="vm.searchFilter.third"> 
    </lx-search-filter> 
    <button class="btn btn--l btn--black btn--icon" lx-ripple> 
     <i class="mdi mdi-apps"></i> 
    </button> 
    </div> 
</div> 

Если открыть ссылку GitHub, то ng-click самой директивы

ng-click="lxSearchFilter.openInput()" 

Мой вопрос, как я могу получить доступ к этой lxSearchFilter контроллер с внешней стороны lx-search-filter директива?

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

link: function(scope, element) { 
    element.bind('click', function(e) { 
    var btn = angular.element(e.target).parent().find('button')[0]; 
    if (!isOpen) { 
     isOpen = true; 
     angular.element(btn).trigger('click'); 
     } 
     return false; 
    }); 

Это делает работу с двумя оговорками:

1. After a single open/close action I cannot reopen it 
2. It's not the Angular way?? 

Итак, еще раз мой вопрос в том, как я могу получить доступ к этому контроллеру lxSearchFilter из-за директивы lx-search-filter?

Answer 1

Вы можете получить доступ к функции управления/ссылка директив 3 участника с помощью decorator

https://docs.angularjs.org/guide/decorators

Вы можете использовать .decorator как .controller и поместить код $provide.decorator в примере внутри него.

---

Edit: способ заключается в использовании decorator расширить его для поддержки программно открыть/закрыть Поиск

https://jsbin.com/siceyeqeza/edit?html,js,output

Обратите внимание, что изменение $delegate[0].scope работает только если у вас есть угловые> 1.5.1 из-за к ошибке https://github.com/angular/angular.js/issues/14785