在我网站的某个页面中,我在ng-switch中有一些指令,如下所示:
<div ng-switch="contentMenuObj.model">
<div ng-switch-when="calendar">
// Some directive
</div>
<div ng-switch-when="history">
// Some directive
</div>
</div>
每次我更改“视图”(日历到历史记录)并返回(历史记录到日历)时,角度会重新渲染日历视图,并在服务器中进行新查询。
我的问题是关于这种行为,是否有可能角度不重新渲染视图?如果不可能,解决这个问题的最佳方法是什么?
答案 0 :(得分:2)
如果我理解正确的话。当contentMenuObj.model改变时,您不想重新呈现视图 - 对吗?如果是这样,则应用单向绑定
<div ng-switch="::contentMenuObj.model">
<div ng-switch-when="calendar">
// Some directive
</div>
<div ng-switch-when="history">
// Some directive
</div>
</div>
在这种情况下,模型只会被加载一次。
如果您只想加载指令一次,请尝试使用ng-show / ng-hide指令。
<div ng-show="contentMenuObj.model == 'calendar'">
// Some directive
</div>
<div ng-show="contentMenuObj.model == 'history'">
// Some directive
</div>
答案 1 :(得分:1)
Angular重新渲染你的指令,因为ng-switch在不满足ng-switch-when
条件时删除div,这使得指令被破坏,下次必须重新渲染。
ng-show
指令与ng-switch
指令形成对比,不删除元素,只隐藏。
因此,如果您想在不重新渲染的情况下隐藏和显示内容,请尝试:
<div>
<div ng-show="contentMenuObj.model === 'calendar'">
// Some directive
</div>
<div ng-show="contentMenuObj.model === 'history'">
// Some directive
</div>
</div>