Question

我正在尝试使用jQuery插件替换Angular 2中某些动态元素中的默认滚动条。

这些元素是使用ngFor循环创建的，也就是说我无法将jQuery事件附加到创建的元素上。

应用程序在某些时候会改变Observable对象，该对象在ngFor内循环以呈现视图。

现在，我想知道Angular何时完成绘制我的元素，以便我可以运行jQuery插件。

我不想在HTML模板中包含任何javascript。
我不想使用ngAfterViewInit，因为这个钩子被激活了太多次
我不想实现基于setTimeout的解决方案（我认为它不可靠）

我使用以下自定义Pipe找到了解决方案：在模板的ngFor周期结束时，我写道：

{{i | FireStoreEventPipe:'EVENT_TO_BE_FIRED'}}

FireStoreEventPipe类似于：

transform(obj: any, args:any[]) {
    var event = args[0];
    //Fire event
    return null;
}

但是这个解决方案并不能让我满意。

是否有更好的方法？

由于

Answer 1

我有类似的问题。我正在使用angular2 rc 1。

我通过创建一个新组件解决了它（一个指令对我没用）。

import { Component, Input, Output, EventEmitter } from '@angular/core';
@Component({
   selector: 'islast',
   template: '<span></span>'
})
export class LastDirective {
   @Input() isLast: boolean;
   @Output() onLastDone: EventEmitter<boolean> = new EventEmitter<boolean>();
   ngOnInit() {
      if (this.isLast)
        this.onLastDone.emit(true);
   }
}

然后我在指令中导入了我想要的组件作为子组件：

directives: [LastDirective],

在html中：

<tr *ngFor="let sm of filteredMembers; let last = last; let i=index;" data-id="{{sm.Id}}">
     <td>
        <islast [isLast]="last" (onLastDone)="modalMembersDone()"></islast>
     </td>
 </tr>

当然实现modalMembersDone（）

ngFor之后的Angular 2火灾事件

1 个答案: