Question

我的组件已插入我的主页，如此

<rs-dropdown></rs-dropdown>

组件被定义为RsDropdownComponent类，引用了RsDropdownController，这是常见的东西......

该组件具有$ onInit（）事件处理程序，该事件处理程序调用某些数据存储区以使用某些数据填充该组件，该组件初始化后将触发此事件。

问题是我不希望组件开始加载数据onInit（）事件。

我希望能够在我想要的时候从我的控制器调用组件的方法。

基本上我需要以某种方式从我的控制器访问Component的实例并调用它的加载函数。

有可能吗？

Answer 1

有人已经提到使用ng-if，或者让你的子组件对异步输入更宽松，如果可能的话，这总是更好的方法，但是你可以做很多事情。

1 - 您始终可以使用事件，使用以下签名创建简单的事件服务：

service.registerEventHandler(id, function)
service.unregisterEventHandler(id, function)
service.sendEvent(id)

在子项中注册处理程序，并在准备好时从父项触发事件

2 - 使用双向绑定的黑暗魔法。在子组件中指定

bindings: {
  darkMagic: '='
},
controller: function() {
  this.$onInit = function() {
    darkMagic = function() { 
          // data ready
    };
    ...

然后从父模板<child data-dark-magic="$ctrl.placeholder">.... 然后在父控制器中，在编译之后，在摘要周期之后的postlink之后...你可以调用this.placeholder();来执行孩子中定义的函数。

3 - 您可以使用onChanges的单向绑定来切换状态

  controller: function() { 
    this.ready = false; // should use onInit but saving lines
    this.$onchanges = function(changesObj) {
        if (changesObj.isReadyProperty) {
            this.ready = changesObj.isReadyProperty.currentValue;
        }
    }
  },
  bindings: {
    isReadyProperty: '<',
  }

然后从父母那里得到<child is-ready-property="$ctrl.imready">... 只需在加载数据时在控制器中切换为真。

还有一种情况是，孩子总是在父母的下面，这个例子就是tabset组件和标签组件。在这种情况下，子（tab）组件可以要求使用tabset控制器，并使用那里定义的API。

或者您甚至可以使用服务进行通信，将服务注入到两个组件中，并以这种方式维护状态。请记住这个解决方案虽然使用工厂模式而不是在角度配方中保持状态。

我确定还有更多方法，但这实际上取决于你的用例。

我仍然希望让你的组件更宽松，以便优雅地处理无数据情况，直到它收到一些东西。

干杯

Answer 2

1.首先，你总是可以使用ng-if，通常这是在你使用某个供应商的组件时完成的：

<rs-dropdown ng-if="loadDropdown"></rs-dropdown>
<div> smth? here or mb another component </div>

2.在当前项目中，我们使用触发器执行此操作：

<rs-dropdown load-data="loadDataTrigger"></rs-dropdown>

3.当然，您可以为此添加角度事件。不是那么灵活的。“

从控制器调用AngularJS 1.5组件的方法？

2 个答案: