angularJS ES6 Директива

Question

Я пытаюсь разработать приложение в угловом es6. У меня проблема с directve. Вот мой код

export default class RoleDirective { 
    constructor() { 
    this.template=""; 
    this.restrict = 'A'; 
    this.scope = { 
     role :"@rolePermission" 
    }; 

    this.controller = RoleDirectiveController; 
    this.controllerAs = 'ctrl'; 
    this.bindToController = true; 
    } 

    // Directive compile function 
    compile(element,attrs,ctrl) { 
     console.log("df",this) 
    } 

    // Directive link function 
    link(scope,element,attrs,ctrl) { 

     console.log("dsf",ctrl.role) 
    } 
} 

// Directive's controller 
class RoleDirectiveController { 
    constructor() { 
    console.log(this.role) 
    //console.log("role", commonService.userModule().getUserPermission("change_corsmodel")); 
    //$($element[0]).css('visibility', 'hidden'); 
    } 

} 

export default angular 
    .module('common.directive', []) 
    .directive('rolePermission',[() => new RoleDirective()]); 

Проблема в том, что я не мог получить значение роли внутри конструктора. вот мой HTML реализация

<a ui-sref="event" class="button text-uppercase button-md" role-permission="dfsd" detail="sdfdsfsfdssd">Create event</a> 

Если я утешать этого он получит объект контроллера. Но при использовании this.role он не получит никакого результата.

Answer 1

Хорошо, мне удалось выяснить, как это работает.

В принципе, значения области не могут быть инициализированы на конструкторе контроллера (поскольку это первое, что выполняется на новом объекте), и есть также обязательство быть рассмотренным.

Существует крючок, который можно реализовать в контроллере, который может помочь вам с вашим прецедентом: $onInit:

class RoleDirectiveController { 
    constructor() { 
    // data not available yet on 'this' - they couldn't be 
    } 

    $onInit() { 
    console.log(this.role) 
    } 
} 

Это должно работать. Обратите внимание, что это угловой метод +5 +, когда вы не полагаетесь на $ scope, чтобы больше удерживать модель. Потому что, если вы используете область действия, вы можете получить ее в конструкторе контроллера (впрыскивать).