AngularJS-基于过滤器更改隐藏Dom元素的更好实现

我正在编写一个示例应用程序，使用AngularJS显示一组youtube视频，并根据语言过滤视频。我将用户操作绑定到ngFilter，并在此基础上隐藏和显示过滤器

Please see JS Fiddle for code ==> http://jsfiddle.net/saratchandramrs/kxk9p/

如果放置DOM操作代码的理想位置是根据本AngularJS帖子的指令-

我应该对我的示例中的指令做些什么吗？或者，如果我按照AngularJS的原则做对了，这会是一种过度的杀伤力，或者有人能帮助我理解吗？或者如果有更好的方法来做我正在做的事情

此外，每次过滤器值更改时，DOM都会重新加载，有没有一种方法可以在不重新加载的情况下完成此功能？或者它就像根据过滤器值隐藏单个元素（类似于css样式：“display:none”）

旁注：我使用Bootstrap3进行UI样式设计

---

感谢您的指导。

性能问题在于您在指令中加载了youtube的iframe。每次过滤时，从youtube加载数据。你看到了吗

谢谢你的链接。我通读了一遍，在某种程度上，我的努力与我的相似。