为什么绑定值在控制器中不能立即以角度显示

我试图在一个应该可用于控制器代码的角度1.6组件中绑定一些值.

我必须误解它,但控制器运行时变量不可用.我管理它的唯一方法是将$ timeout插入到下一个摘要周期中.

我在这做错了什么？

相关部分如下:

var SelectorCtrl = ['$scope', '$http', '$timeout',
  function ($scope, $http, $timeout) {
    var self = this;
    alert("1: " + self.hierarchyId);

    // I'm not 100% sure why this has to be in the next digest cycle
    $timeout(function(){
      $scope.categories = self.categories;
      alert("2: " + self.hierarchyId);

    });
}

app.component('categorySelector', {
  templateUrl: 'categorySelector.html',
  controller: SelectorCtrl,
  bindings: {
    hierarchyId: "@",
    disabled: "=",
    categories: "=",
    onSelectionChanged: "&"
  }
});

请参阅plunker:https://plnkr.co/edit/8rtDuCawdHaiXzQU5VBR

这是因为$compileProvider.preAssignBindingsEnabled(flag)在Angular 1.6 中引入,你可以在配置周期上配置它$compileProvider

如果禁用(false),编译器会在分配绑定之前先调用构造函数.

Angular 1.5.x中的默认值为true,但在Angular 1.6.x中将切换为false.

您将获得$onInitAngular组件的生命周期事件内的所有绑定,其中所有绑定都可用(如果绑定同步传递).

self.$onInit = function() {
  $scope.categories = self.categories;
  alert("2: " + self.hierarchyId);
};

注意:混合$scope使用是不好的做法this.而是避免使用$scope使代码Angular 2迁移证明.

如果要在控制器功能实例化时使用绑定,则可以进行设置$compileProvider.preAssignBindingsEnabled(true).这将使self.categories(绑定)值.

app.config(function($compileProvider){
   $compileProvider.preAssignBindingsEnabled(true)
});