将指令隔离范围绑定传递到其控制器`this`上下文（AngularJS V1.6） [英] Pass Directive Isolate Scope Bindings to its Controller `this` Context (AngularJS V1.6)

问题描述

如何将指令参数传递给它的控制器？

How to pass directive parameter to its controller?

我使用指令：

< directive value = ctrl.item>< / directive>

.directive('directive', [ function () {
    return {
        restrict: 'AE',
        scope: {
            value: '=value'
        },
        templateUrl: 'item.html',
        controller: 'Item as item'
    };
}])

我想在指令控制器内读取值：

I want to read value inside a directive's controller:

.controller('Item', [function Item () {

    console.log(this.value);
}])

是否可以使用 this ？

Is it possible to do using this?

推荐答案

设置 bindToController属性设为 true

Set the bindToController property to true

.directive('directive', [ function () {
    return {
        restrict: 'AE',
        scope: {
            value: '=value'
        },
        //USE bindToController
        bindToController: true,
        templateUrl: 'item.html',
        controller: 'Item as item'
    };
}])

bindToController

此属性用于将范围属性直接绑定到控制器。可以是 true 或具有与scope属性相同格式的对象哈希。

bindToController

This property is used to bind scope properties directly to the controller. It can be either true or an object hash with the same format as the scope property.

当隔离范围时用于指令（见上文）， bindToController：true 将允许组件将其属性绑定到控制器，而不是范围。

When an isolate scope is used for a directive (see above), bindToController: true will allow a component to have its properties bound to the controller, rather than to scope.

实例化控制器后，隔离作用域绑定的初始值将绑定到控制器属性。通过提供称为 $ onInit 的控制器方法，可以在初始化这些绑定后访问它们，在构造完元素上的所有控制器并初始化了它们的绑定之后调用

After the controller is instantiated, the initial values of the isolate scope bindings will be bound to the controller properties. You can access these bindings once they have been initialized by providing a controller method called $onInit, which is called after all the controllers on an element have been constructed and had their bindings initialized.

— AngularJS综合指令API参考

---

使用 $ onInit 生命周期挂钩

---

Use the $onInit life-cycle hook

.controller('Item', function Item () {
    this.$onInit = function() {    
        console.log(this.value);
    };
})

$ compile ：

由于 bcd0d4 ，已预先分配控制器实例上的绑定由de禁用故障。仍然可以重新打开它，这在迁移过程中会有所帮助。预分配绑定已被弃用，并将在以后的版本中删除，因此我们强烈建议迁移您的应用程序，使其不尽快依赖它。

$compile:

Due to bcd0d4, pre-assigning bindings on controller instances is disabled by default. It is still possible to turn it back on, which should help during the migration. Pre-assigning bindings has been deprecated and will be removed in a future version, so we strongly recommend migrating your applications to not rely on it as soon as possible.

初始化逻辑依赖于存在的绑定的元素应放在控制器的 $ onInit（）方法中，该方法保证在绑定完成后始终被称为

Initialization logic that relies on bindings being present should be put in the controller's $onInit() method, which is guaranteed to always be called after the bindings have been assigned.

— AngularJS开发人员指南-从V1.5迁移到V1.6

这篇关于将指令隔离范围绑定传递到其控制器`this`上下文（AngularJS V1.6）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！