64

次のように、ngModel を使用して div の contenteditable 入力コンテンツを双方向にバインドしようとしています。

<div id="replyiput" class="btn-input"  [(ngModel)]="replyContent"  contenteditable="true" data-text="type..." style="outline: none;"    ></div>

しかし、それは機能しておらず、エラーが発生します:

EXCEPTION: No value accessor for '' in [ddd in PostContent@64:141]
app.bundle.js:33898 ORIGINAL EXCEPTION: No value accessor for ''
4

8 に答える 8

117

NgModelは、バインドされた要素がvalueプロパティを持っていることを期待していますが、それdivは持っていません。そのため、No value accessorエラーが発生します。

textContentプロパティ ( の代わりにvalue) とinputイベントを使用して、独自の同等のプロパティとイベント データバインディングを設定できます。

import {Component} from 'angular2/core';
@Component({
  selector: 'my-app',
  template: `{{title}}
    <div contenteditable="true" 
     [textContent]="model" (input)="model=$event.target.textContent"></div>
    <p>{{model}}`
})
export class AppComponent {
  title = 'Angular 2 RC.4';
  model = 'some text';
  constructor() { console.clear(); }
}

Plunker

inputのすべてのブラウザでイベントがサポートされているかどうかはわかりませんcontenteditable。代わりに、いつでも何らかのキーボード イベントにバインドできます。

于 2016-02-13T18:19:06.843 に答える