无法使用通过 ng-if 创建的子作用域设置父变量

Question

我有以下 div<div class="form-group col-lg-12 ignore-left-padding" ng-show="!labeledIntents">  <label for="intent-count"><h4>Number of intents</h4></label>     <div>        <switcher ng-model="manualNumberOfIntents"                  ng-change="onSwitcherChange()"                   false-label="Autodetect" true-label="Manual input">        </switcher>&nbsp;        <input ng-if="manualNumberOfIntents" show-focus="autoNumberOfIntents"               ng-model="$parent.count" type="number" step="1" min="1"                max="200" id="intent-count" placeholder="1-200"               style="width: 75px;" required/>    </div></div>在那里我有一个开关，当它打开时，会显示一个强制性的数字框。对于此文本框，我将其设置为在启用“manualNumberOfIntents”时出现。之后，用户需要在其中输入数字或弹出错误消息。一旦一切都设置好，用户按下提交按钮，该按钮使用提供的信息创建某种项目。这是按下提交时调用的函数的一部分：$scope.submit = function (event) {    event.preventDefault();    if (!$scope.file) {      return;    }    $scope.projectNameDuplication = false;    $scope.requestInProgress = true;    var projectname = $scope.projectname.trim();    var userparticipant = $scope.customChatParticipants ? $scope.userparticipant : "USER";    var agentparticipant = $scope.customChatParticipants ? $scope.agentparticipant : "AGENT";    var count = $scope.manualNumberOfIntents ? $scope.count : false;    console.log($scope.count);然后它使用变量并处理它们。这是激活开关时调用的函数：$scope.onSwitcherChange = function () {    $scope.count = '';  }在上面的代码中，无论我尝试为计数设置什么，console.log 都不返回任何内容。这让我相信 count 只是通过 $scope.onSwitchChange 设置为 '' 但再也没有碰过。我做了一些研究，发现 ng-if 创建了自己的范围，所以如果我使用 ng-model="count" 它不会工作，因为它试图在父级无法访问的范围内引用计数。因此我把 ng-model="$parent.count"。然而，这似乎仍然不起作用......有没有人有任何想法？当我修改 $scope.count 时，它是在父作用域下进行的，因此它不应该影响我在 html 中引用它的方式，对吗？任何建议将不胜感激！我对 angularjs 很陌生，所以如果这是一个明显的问题，我提前道歉。

Answer 1

我把ng-model="$parent.count"。然而这似乎仍然不起作用

$parent仅当模型和控制器之间只有一级范围层次结构时，使用才有效。它不适用于多层次的层次结构。

解决方案是在控制器范围内使用对象的属性：

$scope.form1 = { count: 0 };

$scope.submit = function (event) { 

     console.log($scope.form1.count);

};

<input ng-if="manualNumberOfIntents" show-focus="autoNumberOfIntents"

       ng-model="form1.count" type="number" step="1" min="1" 

       max="200" id="intent-count" placeholder="1-200"

       style="width: 75px;" required/>

那么$parent.count在这种情况下究竟访问的是什么？这会访问层次结构最高点的计数值吗？

$parent.count访问count父作用域的属性。

$parent.$parent.count 访问祖父作用域。

$parent.$parent.$parent.count 访问曾祖父作用域。

新AngularJS开发商往往没有意识到ng-repeat，ng-switch，ng-view，ng-include和ng-if所有新创建子作用域，因此数据隐藏问题常表现为时，这些指令都参与其中。¹

虽然为一个或多个$parent标识符添加前缀可能有效，但它不是一个可靠的解决方案，因为对 HTML 的更改可能会添加或删除层次结构，这反过来会破坏解决方案。更强大的解决方案是定义在父对象的模型，然后引用该对象的属性在孩子：parentObj.someProp。