javascript - 如何将更改事件附加到已经具有已过滤的单向绑定(bind)的文本区域？

Question

我有一个已经与过滤器绑定(bind)的文本区域，因此它会在页面加载时加载正确的信息，但现在我想在更改文本区域时更改模型，但是一旦我添加了模型并更改初始绑定(bind)停止工作的事件。

这是作为一种单向绑定(bind)的 HTML，它有效:

<textarea>{{mainboard | textboard}}</textarea>

我的想法是我会添加一个更改事件，没有模型会出错，所以我添加了一个模型，如下所示:

<textarea ng-model="textmainboard" ng-change="updateMainboard()">{{mainboard | textboard}}</textarea>

如何进行双向绑定(bind)，其中一种方式被过滤(本例中的过滤器是文本板服务)？

编辑:这是我试图做模糊的 js fiddle ，它不需要模型:http://jsfiddle.net/vjkgH/

编辑:确切的用例是我有一个项目列表。项目列表显示为 li 元素并显示在文本区域中，重复项显示为“3x itemb”。项目列表可以通过两种方式更改，点击添加按钮或更改文本区域。

这是一个示例状态:

<ul>
 <li>item1</li>
 <li>item1</li>
 <li>item2</li>
</ul>
<textarea>
 2x item1
 1x item2
</textarea>

Answer 1

对于我自己的用例，问题是当你的新变量不等于你的旧变量时，angular 只运行 $watch [换句话说，更新你的 DOM]，除非 $watch 函数的第三个参数是设置为真。

对于文本区域或任何文本事物上的 ng-model，第三个参数始终为 false，因此它将旧数组与新数组进行比较，它们等于相同的引用，因此，angular 不会认为数组改变了。

我在 github 上向 Angular 社区请求了一项功能，即以某种方式添加了一个选项，以允许在执行 ng-model 时将 objectEquality 设置为 true。否则，您将需要编写自己的指令来模仿 ng-model，并将 $watch 的第三个参数设置为 true。

因此，为了获得我想要的结果，我使用了这个 SO QA 的答案:How to do two-way filtering in angular.js? 并让我对数组进行所有更新，克隆数组，因此总有一个新的引用。效率低下让我很担心，但我的旧笔记本电脑处理起来似乎快如闪电，足够好了。