如何显示 Kendo UI for Angular 组合框打开并在其中使用 *ngIf 指令

Question

ComboBoxComponent 提供了切换组合框弹出窗口可见性的方法 toggle。我想显示已经打开的组合框。我有以下实现：

datalist.component.html

<kendo-combobox #attributecombobox></kendo-combobox>

datalist.component.cs

@Component({    
    templateUrl: './datalist.component.html'
})
export class DatalistComponent implements OnInit {
   @ViewChild('attributecombobox') public attributeCombobox: ComboBoxComponent;
}

我试过设置构造函数：

constructor() {
   this.attributeCombobox.toggle(true);
}

无效。我还尝试了 OnInit 生命周期钩子：

ngOnInit() {
    this.attributeCombobox.toggle(true);
}

同样不行。

正确的方法是什么？提前致谢。

更新 1

抱歉，我没有公开所有代码。 ComboBox 实际上有一个 *ngIf:

datalist.component.html

<kendo-combobox #attributecombobox *ngIf="setAttribute"></kendo-combobox>

datalist.component.cs

    @Component({    
        templateUrl: './datalist.component.html'
    })
    export class DatalistComponent implements OnInit {
       @ViewChild('attributecombobox') public attributeCombobox: ComboBoxComponent;
       setAttribute = true;

       ngOnInit() {
           this.attributeCombobox.toggle(true);
       }
    }

所以我认为我发现使用 *ngIf 的 kendo-combobox 元素存在问题，如您所见这个 plunker 我从 George K plunker 那里分叉出来的（感谢 George）。

更新 2

我提交了一个被分类为错误的问题 here。

Answer 1

最早可能打开组件的地方是在 ngOnInit 中（您的第二次尝试）。调用 toggle 方法对我来说效果很好：

ngOnInit() {
  this.combo.toggle();
}

这是一个可运行的插件：

http://plnkr.co/edit/ssbftD6hg3f7LM86CIPD?p=preview

更新

事实上，如果应用了像 ngIf 这样的结构指令，组件将无法在 ngOnInit 挂钩中使用。基本上，这将脱糖到

<ng-template [ngIf]="show">....combobox here... </ng-template>

您可能已经注意到，模板中的组件不会在第一次初始化时出现。解决方案是使用一个钩子，稍后将在组件初始化时调用，例如 AfterViewInit:

ngAfterViewInit() {
   setTimeout(() => {
     this.combo.toggle();
   });
}

可以在此处找到更新的 plunkr 演示 - http://plnkr.co/edit/quLb3oeiVRJfqACqGKEK?p=preview

如何显示 Kendo UI for Angular 组合框打开并在其中使用 *ngIf 指令

How to show a Kendo UI for Angular combobox open and use an *ngIf directive in it

kendo-ui-angular2

更新 1

更新 2

更新