angularjs – 子范围与孤立范围内的行为bindToController

发布时间：2020-12-17 10:23:01 所属栏目：安全来源：网络整理

导读：我正在玩指令的bindToController选项.我偶然发现使用子范围的行为与孤立范围之间看似奇怪的区别.当我使用隔离范围时,会为该指令创建一个新范围,但对绑定控制器属性的更改将转发到父范围.然而,当我使用子范围时,我的例子就破了. (根据 http://blog.thoughtram

我正在玩指令的bindToController选项.我偶然发现使用子范围的行为与孤立范围之间看似奇怪的区别.当我使用隔离范围时,会为该指令创建一个新范围,但对绑定控制器属性的更改将转发到父范围.然而,当我使用子范围时,我的例子就破了. (根据 http://blog.thoughtram.io/angularjs/2015/01/02/exploring-angular-1.3-bindToController.html#improvements-in-14,应允许使用使用子范围的bindToController)

代码：

{
    restrict: 'E',scope: {},controller: 'FooDirCtrl',controllerAs: 'vm',bindToController: {
        name: '='
    },template: '<div><input ng-model="vm.name"></div>'
};

工作演示https://jsfiddle.net/tthtznn2/

使用子范围的版本：

{
    restrict: 'E',scope: true,template: '<div><input ng-model="vm.name"></div>'
};

演示：http://jsfiddle.net/ydLd1e00/

对name的更改将转发到子作用域,但不会转发到父作用域.这与绑定到隔离范围形成对比.为什么是这样？

这是因为您对两个控制器使用相同的别名(并且与注释中提到的对象与字符串值无关).

您可能知道,控制器作为别名语法只是在作用域上创建别名属性并将其设置为控制器实例.由于在两种情况下都使用vm作为别名(MainCtrl和FooDirCtrl),因此在正常子范围的情况下,您正在“遮蔽”MainCtrl别名.
(在这种情况下,“正常”意味着“原型继承父范围”.)
因此,当您尝试在新作用域上评估vm.name(vm for MainCtrl)以获取“父值”时,它实际上正在评估FooDirCtrl.name(未定义),并且当您尝试分配时也会发生同样的情况回到父范围.

隔离范围版本不受影响,因为范围不是从其父范围继承.

Updated fiddle

更新：
仔细看看源代码,这可能是一个错误(因为对非隔离范围的bindToController的支持被“追溯”添加).
我们似乎已经逃脱了这个错误,因为原型继承,但当名称发生碰撞时,我们运气不好.

我必须仔细检查以确定它是否确实是一个错误,如果它是“可修复的”,但是现在你可以通过为控制器使用不同的别名来解决它(参见上面的小提琴).

这是(部分)为什么我不喜欢使用vm作为我的控制器别名(尽管它受到流行风格指南的建议):)

让我们在angular.js#13021跟踪这个.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!