angular scope ng-if（会创建一个子域）与ng-show的区别

angular scope ng-if

问题一：ng-model在ng-if里边 这个model的值不能反应到控制器里。

<div ng-app >
 <div ng-controller="main">
 Test A: {{testa}}<br />
 Test B: {{testb}}<br />
 Test C: {{testc}}<br />
<div>
 testa (without ng-if): <input type="checkbox" ng-model="testa" />
 </div>
 <div ng-if="!testa">
 testb (with ng-if): <input type="checkbox" ng-model="testb" />
 </div>
</div>
</div>

原因是：ng-if 指令像其它指令一样，会创建一个子域（child scope）。因此，ng-if里的ng-model的$scope是子域下的。

解决代码是：<input type="checkbox" ng-model="$parent.testb" />

或者：

<div ng-show="!testa">
 testb (with ng-if): <input type="checkbox" ng-model="testb" />
</div>

同样的，问题二：我在ng-if里引用了自定义的指令，然后自定义指令里通过$scope.$parent.variableName='郑州网建' 设置里值。那么，在ng-if所在的控制器里，也是获取不到变量variableName的变化的。

因此，ng-if 换成 ng-show 就可以解决了。