Обязательная настраиваемая директива для наблюдения в Angular2

Question

Я не могу понять, как привязка данных работает с пользовательскими директивами в Angular2. Скажем, у меня есть пользовательский директиву FoobarDirective, которая принимает @Input, который является Observable:

@Directive({ 
    selector: 'foobar' 
}) 
export class FoobarDirective implements OnInit { 
    @Input() anObservable: Observable<string[]>; 

    ngOnInit() { 
    this.anObservable.subscribe(values => { 
     console.log(values); 
    }); 
    } 
} 

И исполнительный компонент, как это:

@Component({ 
    selector: 'my-app', 
    providers: [], 
    template: ` 
    <div> 
     <h2>{{ message }}</h2> 
     <div foobar [anObservable]="toBind"></div> 
    </div> 
    `, 
    directives: [FoobarDirective] 
}) 
export class App implements OnInit { 
    message: string; 
    toBind: Subject<string[]>; 

    ngOnInit() { 
    this.message = 'Angular2 works!'; 

    this.toBind = new Subject<string[]>(); 
    this.toBind.next(['a', 'b', 'c']); 
    } 
} 

... но я получаю следующее сообщение об ошибке: Can't bind to 'anObservable' since it isn't a known native property ,

Вот plunker.

Answer 1

Я думаю, что проблема является селектор вашей директивы:

@Directive({ 
    selector: '[foobar]' // <------ 
}) 
export class FoobarDirective implements OnInit { 
    (...) 
} 

Поскольку вы используете неправильный селектор, директива не применяется так Angular2 не знает об этом входе ...