Using 'require' in angular component

二次信任 提交于 2019-11-28 11:59:38

The cited source is outdated. As of 1.5.0, component controllers can be required in other components (the same applies to directives).

An example from the guide shows the way how the components and directives should interact in 1.5 without the aid from link.

When require object and bindToController are used together, required controller instances are assigned to current controller as properties.

Because this happens during directive linking, the required controllers aren't available in controller constructor, that's why $onInit magic method is there. If it exists, it is executed right after adding required controllers to this.

Both

app.directive('someDirective', function () {
  return {
    scope: {},
    bindToController: {},
    controllerAs: 'someDirective',
    require: {
      anotherDirective: '^anotherDirective'
    },
    controller: function ($scope) {
      console.log("You don't see me", this.anotherDirective);

      this.$onInit = function () {
        console.log("Now you do", this.anotherDirective);
      };
    }
  }
});

and

app.component('someComponent', {
  controllerAs: 'someComponent',
  require: {
    anotherDirective: '^anotherDirective'
  },
  controller: function ($scope) {
    console.log("You don't see me", this.anotherDirective);

    this.$onInit = function () {
      console.log("Now you do", this.anotherDirective);
    };
  }
});

declaration styles are on a par under the hood and can be used interchangeably in 1.5, and component is a concise one.

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!