Question

我的目标是在angular2中应用jQuery插件。它可以是任何插件，如jQuery.DataTable，bootstrap-select等。

我正在做的是从服务中获取数据。服务发出ajax请求。我使用ngFor绑定将数据绑定到select或table，然后调用jQuery插件函数（使用定义文件）来呈现正确的插件。

这里的问题是时差。在第一步我绑定数据，在第二步我应用插件但我认为绑定有点慢，所以插件的代码运行在实际绑定html渲染之前。这给我带来了麻烦。

示例代码如下：

private loadPermissionGroups() {
        this.permissionManagerService.getPageData()
            .subscribe(res => {
                this.employeeList = res.Data.PageData.EmployeeList;
                // applyDataTable jQuery code
            },
            null,
            () => {
                this.showLoading = false;
            });
    };

请建议。

Answer 1

你也可以使用指令：

/**
 * [Directive description]
 * @param {"[custom-dropdown]"}} {  selector [Directive for adding jQuery for select box]
 */

@Directive({
   selector: "[custom-dropdown]"
})


/**
 *[Class description]
 */
export class customDropdown implements AfterViewInit {
  constructor(public el: ElementRef) {}

  ngAfterViewInit() {
    $(this.el.nativeElement).selectpicker();
  }
}

希望这会对你有所帮助。

如何在Angular2中使用jQuery插件？之前运行插件，之后更新DOM

1 个答案: