1. 程式人生 > >Angular js指令 ng-if&&ng-show

Angular js指令 ng-if&&ng-show

1⃣️問題描述: ng-if:刪除整個dom元素; ng-show:控制新增的html元素的顯示與消失,作用類似於css的dispaly:none和block; 重點在於ng-if會遇到scope繫結值錯誤的情況;

2⃣️html程式碼 在這裡插入圖片描述 效果: 在這裡插入圖片描述程式碼分析: 通過下面兩個按鈕控制消失,div裡面都有一個輸入框,用ng-model綁定了一個值, 輸入後發現,ng-if繫結的值是無法顯示在外面的p標籤外面。

結論: ng-if會影響並阻斷$scope繫結值,ngshow不會,建議:div裡面有很多其他指令如ng-model的儘量使用ng-show,單個獨立的可以使用ng-if;