将ng-repeat与filter一起使用时，如何保留DOM元素? [英] How to preserve DOM elements when using ng-repeat with filter?

问题描述

我有一个带过滤器的ng-repeat.当某些项目被过滤器过滤掉，然后在再次更改过滤器后将其还原时，将为这些项目创建新的DOM元素.如果对该项目进行了任何DOM操作，则在隐藏该项目并使用过滤器将其恢复后，该项目将丢失.

I have an ng-repeat with a filter. When some items are filtered out by the filter and then they are restored after another filter change there are new DOM elements created for these items. If there was any DOM manipulation on the item it gets lost after item is hidden and restored with filter.

即使通过过滤器删除了项目，是否仍可以保留DOM元素?

Is there a way to keep the DOM elements, even when item is removed by filter?

我尝试使用track by，但这无济于事.

I tried using track by, but it doesn't help.

这是重新出现问题的小提琴. 重建步骤:

Here is a fiddle that recreates the problem. Steps to recreate:

1. 单击按钮将颜色应用于DOM元素
2. 在过滤器输入中键入一些内容(例如'ap')以隐藏某些元素
3. 删除过滤器.恢复的元素失去了风格.

推荐答案

Angualr正在动态添加和删除这些模板.模板是指您的ng-repeat内包含任何标签.没有办法将其保留在ng-repeat中.相反，如果您希望保留此颜色更改，则它必须是您要重复进行的模型的一部分.这有道理吗?

Angualr is dynamically adding and removing those templates. By template I mean whatever tag(s) are inside your ng-repeat. There is no way to preserve that in an ng-repeat. Instead, if you want this color change to be preserved, it needs to be a part of the model you are ng-repeat ing over. Does that make sense?

直接将颜色添加到模板style="color: {{fruit.color}}"

Add the color directly to the template style="color: {{fruit.color}}"

看到我正在谈论的内容

http://jsfiddle.net/nferjvsp/1/

这篇关于将ng-repeat与filter一起使用时，如何保留DOM元素?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！