想象一个应用程序有一个列表页面,例如一个显示用户列表的表格。表格的每一行都有一个名为“编辑”的按钮,单击此按钮时,浏览器右侧会出现一个右侧面板,其中包含用于编辑该用户内容的表单。当表单被保存或关闭时,右侧面板消失。我看到有些人使用 ng-hide/ng-show 来显示/隐藏编辑表单,而其他人使用路由。我的问题是什么是最好的方法以及为什么。
3 回答
我认为这取决于你想要什么。当您选择使用路由时,您可以为该页面添加书签,因为您有一个完整的 URL。但是当你选择和你一起工作时, nghide/ngshow
你不能。
除了使用ngshow/ng-hide
,您还可以考虑使用ng-if
。不同之处在于ng-if
从 Dom 树中删除了 HTML。因此,假设您在列表中有 100 个项目,并且您使用将ng-hide/ng-show
所有数据加载到 Dom 树中。但是在使用时ng-if
需要的 html 只是在需要的时候才附加到 dom 中。
当您的 html 中包含模板但只想根据某些条件显示/隐藏时,使用 ng-show / ng-hide。
路由用于完全转到单独的 html。
由于添加/编辑是显示列表的单独功能,因此理想情况下,这些表单应显示在单独的页面中。但这取决于 UI 的设计方式。
您可以使用路由添加/编辑表单或 ng-show/ng-hide。
希望这可以帮助。
根据您的描述,听起来您想使用显示/隐藏。当您编辑一个条目时,您希望列表的其余部分仍然存在,并且当您保存该条目时,您希望直接返回到列表视图。您可以ng-show="edit_object != null"
对编辑表单执行类似操作,当您单击编辑按钮时,您$scope.edit_object=row
可以使用要编辑的对象的内容设置并填充表单的输入。当您保存或关闭编辑表单时,您可以设置$scope.edit_object=null
.