I have this code below. Basically this is a component with a directive that subscribes to a text field model.
If I type a text field, the subscription triggers and the console log change, however, if the model is changed externally and retrieved from @Input in the component, the subscription in the text field does not start, although the text in the text field is updated.
Why doesn't it start every time the text changes?
@Directive({
selector: 'textarea[mydir]',
host: {'ngFormControl':'myCtrl'}
})
class MyDirective {
myCtrl: any;
constructor(){
this.myCtrl = new Control();
this.myCtrl.valueChanges.subscribe(
(data) => {
console.log('Model change', data);
});
}
}
// Project card
@Component({
selector: 'four',
providers: [],
styles: [ require('./four.scss') ],
directives: [NgFor, MyDirective],
template: `
Hello, this is working! <br>
<textarea mydir [(ngModel)]="pp.status"></textarea>
`,
})
export class Four {
@Input() pp: Array<any>;
constructor() {
}
}
source
share