web-dev-qa-db-ja.com

ng-modelバインディングがdivで機能しない

AngularJSの2つのバインディングはdivで機能していません。 divを編集可能にしたいのですが、それは起きていません。誰かが間違っている可能性があることを提案してもらえますか？テキストボックスでも同じバインディングが正常に機能します。これは私のコードです：

<input type="text" ng-model="userProfile.firstName"/>
<div class="profile-name" contenteditable="true" ng-model="userProfile.firstName"></div>
javascriptjqueryhtmlhtml5angularjs
20
Jack

これを試してください、それは役立つかもしれません https://github.com/angular/angular.js/issues/528

これは3年前の未解決の問題で、多くの人が修正したいと考えています。バグではなく、post-1.2-milestoneおよびfeatureとしてマークされています。 Angular.jsは2014年2月のリリース1.2.13にあるため、チームの誰も現時点でこの問題を気にしていないようです。その結果、独自のコードを展開するか、input/textareaコントロールを使用することをお勧めします。

13
Grievoushead

それが正しい振る舞いです。 from angular docs "ng-modelは、Angular双方向のデータバインディングを実行するよう指示するディレクティブです。入力、選択、テキストエリアと連携します。 ngModelを使用する独自のディレクティブを簡単に作成できます。」

言い換えると、divで動作させたい場合は、モデルをdivのinnerhtmlにバインドするディレクティブを宣言します。 docs ここ

6
Joe Minichino

ng-bindを使用します。

<ANY
  ng-bind="expression">
...
</ANY>

https://docs.angularjs.org/api/ng/directive/ngBind を確認してください。

3
whoami