是否可以使用ngModel对自定义指令执行双向绑定?

时间:2016-11-21 05:06:31

标签: angularjs angular angularjs-directive angular-ngmodel angular2-ngmodel

我的用例完全不同。当我剥离所有其他因素时,归结为此。

说我有以下输入元素

<input type="text" [customDirective] [(ngModel)]="myValue" >

customDirective的工作是查看用户输入的值,并根据动态输入更改其值。

如何实现双向绑定。

我玩过ControlValueAccessor,DefaultValueAccessor。但无论我做什么,我都无法实现双向绑定。我一次实现的最大值是模型更新的视图更新,但不是相反。但那段代码丢失了。

这是香草plunker link.

PS:我已经提到了以下内容。但是它们都没有帮助实现w.r.t到指令

的双向绑定

http://blog.thoughtram.io/angular/2016/07/27/custom-form-controls-in-angular-2.html

angular2 wysiwyg tinymce implementation and 2-way-binding

提前致谢

1 个答案:

答案 0 :(得分:1)

最后想出了如何做到这一点。

可以使用ControlValueAcessor

完成模型到UI的更改

UI to Model可以像下面这样完成

import {Output} from '@angular/core';

使用事件发射器

@Output() ngModelChange = new EventEmitter();

每当数据发生变化时都会发出事件

this.ngModelChange.emit(YOUR_NEW_VALUE);

这是详细的例子

Using Tinymce editor as a directive