angularjs - $onInit 没有立即绑定(bind)数据

Question

我的应用中有这个组件:

<actions-bar actions="$ctrl.actionsBarData"></actions-bar>

这是 Controller /组件定义:

.component('actionsBar', {
    controller: 'actionsBarController',
    bindings: {
        actions: '<'
    }
})

.controller('actionsBarController', function() {

    var vm = this;

    vm.$onInit = function() {
        console.log(vm.actions);
        setTimeout(function() {
            console.log(vm.actions);
        }, 500);
    };
});

注意两个 console.log $onInit 中的语句.在浏览器中，第一个日志语句打印 undefined .第二条语句，包裹在 setTimeout 中正确打印出 this.actions目的。

根据 Angular 文档:

$onInit() - Called on each controller after all the controllers on an element have been constructed and had their bindings initialized

如果绑定(bind)已经初始化，为什么数据不能立即可用？为什么我必须在它可用之前设置一个 500ms 的延迟？

如果 $onInit不是这里的解决方案，我怎样才能可靠地访问我的 Controller 中的绑定(bind)数据？看来这是正确的生命周期钩子(Hook)，在这种情况下，其他钩子(Hook)似乎都不是我想要的。

Answer 1

这是因为虽然绑定(bind)已经在 Controller 中初始化，但它们不一定是在它们来自的地方初始化的。如果您使用异步调用填充绑定(bind)，则该对象将未定义或为空。

$onChanges 允许您检查绑定(bind)发生的更改。

vm.$onChanges = function (changesObj) {
    console.log(changesObj.actions);
}

如果我上面描述的事情正在发生，这将为您解决。

编辑:一句话