угловой директивный контроллер «this» return undefined

Question

Я пытаюсь подключить две директивы, используя require и разделяя родительский контроллер.

Я делал это Gazillion раз в других проектах, но для жизни меня я не могу получить эту работу ...

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

вот мой код для родительской директивы:

app.directive('defaultHeader',() => { 

    let defaultHeaderCtrl = ($scope, $element) => { 

     let containEl, 
      elHeight = 500; 

     console.log(this) // returns 'undefined' 

     function resizeElement(el, height) { 
      el[0].style.height = `${height}px` 
     } 

     if (_.isUndefined($scope.coverImgUrl)) { 
      resizeElement($element, elHeight); 
     } else { 

     } 
    }; 

    return { 
     restrict: 'A', 
     scope: { 
      coverImgUrl: '=' 
     }, 
     controller: defaultHeaderCtrl 
    }; 
}); 

This fiddle показывает, что контроллер директивы this должен возвращаться конструктор.

Вот некоторые контексты, если кто-нибудь интересуются:

• пользовательского интерфейс шаблон маршрутизатора является директивой элементом <div default-header data="data"></div>
• щий маршрутизатор решает данные, а затем передает его через контроллер с директивой

спасибо помощь

Answer 1

Arrow (помимо того, что они выглядят опрятно) служит для замены lexical this с контекстным. Поскольку контроллер также определен в функции стрелок, он получит свой родительский контекст как this. Который undefined в строгом режиме.

Использование

function defaultHeaderCtrl ($scope, $element) { ... } 

и не заменяют все function со стрелками только потому, что ES6 это позволяет.

Answer 2

Это оказалось довольно легко решить после того, как я начал изучать различия между моими код и отправленный jsFiddle.

Я использую babeljs, и, очевидно, что-то происходит с областью, когда я использую синтаксис функции стрелки для контроллера () => {}.

После переключения на function() {}, this теперь возвращает конструктор, и директивы работают должным образом.

См отмечен ответ выше для контекста функция^