以编程方式更新 Angular 2 中指令的输入值

Question

我在组件中有这个模板：

...
<div class="myCustomDirective">
    <input name="value" type="text" [(ngModel)]="value" />
</div>
...

我想更新 的值myCustomDirective。像这样直接更新输入元素：

this.elementRef.nativeElement.querySelector('input').value = 'bla';

...不更新组件中的模型。

使用角度 4.2.6。

Answer 1

感谢@Pablo 和他的链接Changing Component Property from Directive in Angular2，我找到了我的解决方案。

在指令中：

import {
    EventEmitter,
    Output
} from '@angular/core'

@Output() updateValue: EventEmitter < any > = new EventEmitter();

inAnyFunction() {
    this.updateValue.emit('bla');
}

在组件中：

...
<div (updateValue)="value = $event">
...

我对 Angular 每天都越来越失望。如果我正在使用，[(ngModel)]我希望以编程方式更新输入元素（因为为什么当我手动和编程更新输入元素时会有所不同？）会传播更改。无用的框架带来的问题多于解决方案。