无法使用通过 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) {&nbsp;&nbsp; &nbsp; &nbsp;console.log($scope.form1.count);};<input ng-if="manualNumberOfIntents" show-focus="autoNumberOfIntents"&nbsp; &nbsp; &nbsp; &nbsp;ng-model="form1.count" type="number" step="1" min="1"&nbsp;&nbsp; &nbsp; &nbsp; &nbsp;max="200" id="intent-count" placeholder="1-200"&nbsp; &nbsp; &nbsp; &nbsp;style="width: 75px;" required/>那么$parent.count在这种情况下究竟访问的是什么？这会访问层次结构最高点的计数值吗？$parent.count访问count父作用域的属性。$parent.$parent.count&nbsp;访问祖父作用域。$parent.$parent.$parent.count&nbsp;访问曾祖父作用域。新AngularJS开发商往往没有意识到ng-repeat，ng-switch，ng-view，ng-include和ng-if所有新创建子作用域，因此数据隐藏问题常表现为时，这些指令都参与其中。1虽然为一个或多个$parent标识符添加前缀可能有效，但它不是一个可靠的解决方案，因为对 HTML 的更改可能会添加或删除层次结构，这反过来会破坏解决方案。更强大的解决方案是定义在父对象的模型，然后引用该对象的属性在孩子：parentObj.someProp。