AngularJS - ng-model在满足的<span>上失败

Ale*_*lan 16 javascript html5 contenteditable angularjs angularjs-ng-model

我正在学习AngularJS.我遇到了一些我无法解释的事情,也没有找到任何解释(或解决方案).

我有一个简单的AngularJS应用程序,我试图绑定<span contenteditable="true">一个值,但它不起作用.例如:

<!-- Works as expected -->
<input data-ng-model="chunk.value"></input>

<!-- Shows value, but doesn't bind - changes not reflected in model -->
<span contenteditable="true">{{chunk.value}}</span>

<!-- This is empty -->
<span contenteditable="true" data-ng-model="chunk.value"></span>
Run Code Online (Sandbox Code Playgroud)

如何使最后一个跨度使用双向绑定,以便编辑其值更新chunk.value,反之亦然?

小智 21

ng-bind!在'span'中使用ng-bind进行单向绑定.

请参考这里的示例:https://docs.angularjs.org/api/ng/directive/ngBind

所以你的路线是: <span contenteditable="true" ng-bind="chunk.value"></span>

希望这有帮助