javascript - 为什么从 ui-bootstrap 模式 Controller 绑定(bind)到 $scope 字符串值不起作用？

Question

我正在使用 ui-bootstrap 来处理我的模式。我将 $scope 作为范围参数传递，它看起来像这样:

var modalInstance = $modal.open({
    templateUrl: 'views/pages/gethelp/modals/bulk_change.html',
    controller: BulkChangeCtrl,
    size: 'lg',
    scope: $scope,
    backdrop:"static",
    resolve: {
      type: function() { return type; },
      field:function() { return field; },
      preset: function() { return preset; }
    }
  });

在我的模态 Controller 中，我定义了一个模型字符串值，我希望将其绑定(bind)到输入并在用户点击提交时用作所选值。这很简单，设置如下:

$scope.val = "";

然而，在我通过单击按钮调用的提交函数中，无论如何，$scope.val 都是空的。就像这些函数引用了完全不同版本的 $scope.val 一样。但在我看来，我可以绑定(bind)到 {{val}} 没有问题。

这是为什么呢？当我将代码更新为:

$scope.obj = { val:"" };

一切都按预期工作，我可以绑定(bind)到 {{obj.val}}。我在这里完全错过了什么？

Answer 1

这是因为 bootstrap 使用范围参数创建了提供范围的子范围 (@var modalScope = (modalOptions.scope || $rootScope).$new();)。因此，在 Angular 子作用域中，原型(prototype)继承自父作用域。原始类型(当绑定(bind)中没有 . 时)将不会在原型(prototype)链中被查询，并且将添加一个新属性 val 并更新它，这不会被反射(reflect)在底层作用域中，只有对引用类型(对象、函数引用等)的更新才会反射(reflect)更改，因此 obj.val 可以工作，因为父作用域也引用相同的 >obj.

所以当你这样做时:-

 $scope.val = "";

在提供的作用域之外创建的新子作用域将更新子作用域中的 val，因为它不会更新为引用类型上的值，您不会看到它在其父作用域中更新。

这是一个good read