Angularjs. Область наследования в вложенной директиве

Question

На данный момент пытается написать код в стиле Angular2, т. Е. Без использования контроллеров. Столкнувшись с проблемой передачи данных из внешней и внутренней директивы. Как это сделать правильно? Главный вопрос заключается в том, как внутри директивы обращаться к внешней области и использовать данные в шаблоне внутренних директив? Пример on codepen

<test-directive> 
    <nested/> 
</test-directive> 

Answer 1

я упростил вам codepen см мой модифицированный version.

class Nested { 
    restrict='E'; 
    template='<p>Nested {{inner.outer}} {{inner.last}}</p>'; 
    controller=function(){ 
    this.last='Pupkin'; 
    }; 
    controllerAs='inner'; 
    bindToController={ 
    outer: '=' // a communicating point of outer and inner directives 
    }; 
} 

Дело в том, что в bindToController, вы можете добавить конечной переменной, так как outer здесь. И во внешнем шаблоне дайте ему значение: <nested outer="outer.first"/>.

@ ответ Гюнтера Zöchbauer является для углового 2.

Кроме того, если вы хотите увидеть весь пример использования стиля компонента с Angualr 1, вы можете увидеть мой express-angular-es6-starter, A TODO MVC с ES6 и стилем компонента Угловые коды 1.

Answer 2

Вы должны передать значения явно

<test-directive> 
    <nested [someInput]="somePropertyOnParent"></nested> 
</test-directive> 

@Component({ 
    selector: 'nested', 
    template: `<ng-content></ng-content>`)} 
class Nested { 
    @Input() someInput; 

    ngOnInit() { 
    console.log(this.someInput); 
    } 
}