AngularJS呈现巨大的动态形式

时间:2015-09-28 20:19:28

标签: javascript angularjs forms

我和我的团队正在开发一种混合移动应用程序(离子),它基本上使用SQLite作为数据源来构建一个用户随后填写的完全动态的表单。表单是由部分构建的,部分是由字段构建的。每个字段都是一个单独的自定义指令(如输入,下拉列表等),它在init上接收安装对象(ui.config)。这些指令完全可以使用,并且它们包含所有要呈现的信息(模板,逻辑,验证,特殊功能等)。但是......我们使用此应用程序构建的一些表单可以轻松地达到每页50个字段,因此我们经常遇到冻结的UI。我们在表单中有很多ng-repeat循环,我们尝试用quick-ng-repeat替换它们,使用bindeonce和内置::,但没有做出严重的改进。 UI仍然停滞不前。

我们构建表单的概念是这样的:

1st Loop: ng-repeat form in forms
   2nd Loop: ng-repeat section in sections
      3rd Loop: field in fields => custom directive (input control)

我想知道是否有一种方法可以在编译之前渲染Angular模板。我们构建模板布局和逻辑的ng-repeats很慢,所以我认为唯一可以提升效果的是创建一个构建动态HTML然后在其上调用$ parse的指令。

有没有人与很多观察者有过巨大形式的经历?我们需要有关如何处理此问题的建议。

谢谢!

1 个答案:

答案 0 :(得分:1)

在$ digest之外编写代码似乎就是显示数千个元素的方式。它在更新部分有点冒险,你必须追踪要更新的内容 - 其余的只是花生。 您可能觉得有必要删除ng-mouse *或ng-click类型的事件,并在父项上有一个单独的监听器(您仍然可以通过event.target检测作者是谁)。

根据另一条评论:50个表单元素不应该减慢您的页面速度。做一些性能分析,看看谁更新你的数据以及在什么时间间隔 - 在循环中有任何$ digest,你看到"达到最多10个摘要周期"?

相关问题