情景:
一般我們寫代碼的時候需要根據(jù)某個數(shù)據(jù)的狀態(tài)來控制它在頁面里的顯示隱藏觅丰。
實現(xiàn):
使用ng-show,ng-hide
和ng-if
可以實現(xiàn)杆烁。
區(qū)別:
ng-show/ng-hide
是通過修改CSS樣式方式控制元素顯示與隱藏荠商,對應的DOM元素會一直存在于當前頁面中捍壤,而ng-if
根據(jù)表達式的值動態(tài)的在當前的頁面中添加刪除頁面元素。如果賦值表達式的值為false栈妆,那么這個元素就會從頁面中刪除胁编,否則會添加一個元素厢钧。
ng-if的坑
ng-if
這個指令會在運行時單獨創(chuàng)建一個自己的作用域,必須要在要傳值的地方給加$parent
掏呼,否則在ng-if所處的標簽范圍內(nèi)綁定的變量是取不到值的坏快。
例如將ng-model=“item”
改為ng-model=“$parent.item”