AngularJS 在指令范围内的更改不会更新父控制器范围

Question

HTML：

<div ng-app="myApp" ng-controller="Controller">

    <test ng-if="toggle" props="condition"></test>

</div>

Javascript：

var myApp = angular.module('myApp', []);

myApp.controller('Controller', ['$scope', '$timeout', function($scope, $timeout) {

    $scope.condition = [true];

    $scope.toggle = $scope.condition[0];

    $scope.$watch('condition', (newv, oldv, scope) => {

        console.log('old: ' + oldv);

        console.log('new: ' + newv);

        console.log('toggle: ' + scope.toggle);

    }, true);

}]);

myApp.directive("test", function() {

   return {

       template: '<div>directive show</div>',

       replace: true,

       scope: {

           props: "="

       },

       controller: ['$scope', '$timeout', function($scope, $timeout) {

           $scope.props[0] = false;

       }]

   }

});

行为是在condition[0]被指令更改为 false 后，我可以在控制台日志中看到新值，但toggle没有更新。

我的问题是：

为什么更改toggle时不更新condition[0]？为什么摘要周期也没有更新toggle？或者toggle，当其分配的值发生变化时，摘要循环甚至会更新吗？

而且我不是在寻求解决此问题的方法，而是寻求解决此问题的原因。

Answer 1

对我来说，你的问题是这样的：var a = false;var b = a;console.log(a,b);var b = true;console.log(a,b);为什么a不是true第二次之后console.log？不应该a和b一样吗？不，因为a和b是独立的实体。类似地，当代码值分配false给$scope.props[0]该指令的范围势必$scope.condition[0]父范围。$scope.toggle并且$scope.condition[0]是独立的实体。a改变时不改变b。$scope.toogle改变时不改变$scope.condition[0]。为什么摘要循环也不会更新切换？或者，当其分配的值发生变化时，摘要循环甚至会更新切换吗？该ng-if="toggle"指令在 上创建一个监视$scope.toggle。它从不修改$scope.toggle.在props="condition"结合上创建一个表$scope.props的指令和更新的价值$scope.condition父$scope。因为它是双向绑定，所以它也会监视$scope.condition父对象并更新$scope.props指令的属性。$scope.toggleAngularJS 框架或其摘要循环永远不会更新该属性。

Answer 2

尝试删除replace: true指令配置中的 。使用时replace: true，它将用内容替换指令标记，因此您将丢失ngIf指令，因为toggleis的初始值true。<test ng-if="toggle" props="condition"></test>将被替换为&nbsp;<div>directive show</div>所以结果将是<div ng-app="myApp" ng-controller="Controller">&nbsp; <div>directive show</div></div>