angular.element().hide() 与 ngIf
angular.element().hide() versus ngIf
Angular 可以访问某些 jquery 函数 here
我只是想知道 .hide() 和使用 ngIf 指令在性能上是否存在差异?
添加来自评论的说明
我了解 ngIf 和 ngShow 之间的区别,但我想知道使用 ng 指令与调用 angular.element() 并使用 .hide()
链接之间的性能差异
hide/show
不会从 dom 中删除元素,而只会添加 display:none
属性,而 ng-if
会 remove
元素完全来自 dom
。
如果你的UI有很多元素,你可以使用ng-if来实例化相关的元素,这样可以节省很多资源。由于您的视图不需要创建所有视图,然后将 display:none
属性 应用于不应在 view
中显示的视图。
如果您经常 remove
和 show
一个元素,hiding
它而不是 removing
可以改进 performance
。
.hide()
方法相当于.css( "display", "none" )
,而ng-if
从dom中删除元素。这是主要区别。
jqlite .hide()
的行为方式与 ng-show
/ ng-hide
指令相同
The .ng-hide CSS class is predefined in AngularJS and sets the display
style to none (using an !important flag).
Angular 可以访问某些 jquery 函数 here
我只是想知道 .hide() 和使用 ngIf 指令在性能上是否存在差异?
添加来自评论的说明
我了解 ngIf 和 ngShow 之间的区别,但我想知道使用 ng 指令与调用 angular.element() 并使用 .hide()
链接之间的性能差异hide/show
不会从 dom 中删除元素,而只会添加 display:none
属性,而 ng-if
会 remove
元素完全来自 dom
。
如果你的UI有很多元素,你可以使用ng-if来实例化相关的元素,这样可以节省很多资源。由于您的视图不需要创建所有视图,然后将 display:none
属性 应用于不应在 view
中显示的视图。
如果您经常 remove
和 show
一个元素,hiding
它而不是 removing
可以改进 performance
。
.hide()
方法相当于.css( "display", "none" )
,而ng-if
从dom中删除元素。这是主要区别。
jqlite .hide()
的行为方式与 ng-show
/ ng-hide
指令相同
The .ng-hide CSS class is predefined in AngularJS and sets the display style to none (using an !important flag).