在 angularjs ng-switch 子范围形式不可用在父范围上不可用答案

【问题标题】：in angularjs ng-switch child scope form is not available not be available on the parent scope在 angularjs ng-switch 子范围形式不可用在父范围上不可用
【发布时间】：2017-04-27 11:15:50
【问题描述】：

访问ng-switch中编写的AT模型对象，这里ng-switch创建一个子作用域，并在这个作用域上创建表单。因此，子范围表单在父范围上不可用。请帮忙

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body ng-app="">

  <input type="radio" ng-model="fileType" value="Excel" style=" margin-left: 19px;" >Excel
  <input type="radio" ng-model="fileType" value="Text" style=" margin-left: 19px;" >Text

  <div ng-switch="fileType">
    <div ng-switch-default="Excel">
      <h4 style="margin-top: 15px;">
        <b>Analysis Type </b> 
        <input type="radio" ng-model="AT"  value="SRI"  style=" margin-left: 8px;" >SRI
        <input type="radio" ng-model="AT"   value="JAG" style=" margin-left: 23px;" >JAG
      </h4>
      <!-- {{AT}}  i am  able to acess it -->
    </div>
    <div ng-switch-when="Text">
      <h4 style="margin-top: 15px;"></h4>
    </div>
  </div>
  {{fileType}}	
  {{AT}} <!-- how can i access it -->

</body>
</html>

【问题讨论】：

标签： angularjs ng-switch

【解决方案1】：

由于ng-switch 创建了自己的范围，这是一个范围继承问题。

在ng-switch 块内使用ng-model="$parent.AT"

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body ng-app="">

<input type="radio" ng-model="fileType"   value="Excel" style=" margin-left: 19px;" >Excel
<input type="radio" ng-model="fileType"   value="Text" style=" margin-left: 19px;" >Text

<div ng-switch="fileType">
          <div ng-switch-default="Excel">
		  <h4 style="margin-top: 15px;"><b>Analysis Type </b> 
			<input type="radio" id="atype_sri" ng-model="$parent.AT"  value="SRI"  style=" margin-left: 8px;" ><label for="atype_sri">SRI</lable>
			<input type="radio" id="atype_jag" ng-model="$parent.AT"   value="JAG" style=" margin-left: 23px;" ><label for="atype_jag">JAG</label></h4>
            </div>
            <div ng-switch-when="Text">
		  <h4 style="margin-top: 15px;">		       </h4>
            </div>
            </div>
	{{fileType}}	
     {{AT}} <!-- now you can access it -->

</body>
</html>

【讨论】：

非常感谢您的反馈