用Angular2引导数据报警器

Question

我需要将自举数据报警器与角2结合使用。

import {Component, ElementRef, OnInit} from '@angular/core';
declare var $: any;

@Component({
    templateUrl: 'app/views/daily-reports.html'
})

export class DailyReportsComponent implements OnInit {
    constructor(private elRef: ElementRef) {}

    ngOnInit(): void {
        $('#daily-reports').datetimepicker();
    }
}

<div class="container">
    <div class="row">
        <div class='col-sm-6'>
            <div class="form-group">
                <div class='input-group date' id='daily-reports'>
                    <input type='text' class="form-control" />
                    <span class="input-group-addon">
                        <span class="glyphicon glyphicon-calendar"></span>
                    </span>
                </div>
            </div>
        </div>
    </div>
</div>

在我的index.html文件中，我有所有需要的文件- js库和css文件，但是我得到了错误。

TypeError:无法读取未定义的属性“addClass”

当我尝试使用相同的没有角度的代码时，我会像往常一样正确工作。有没有办法解决这个问题，或者有人能教我如何在Angular2中使用这个插件？

Answer 1

您必须将该初始化放在ngAfterViewInit中，因为DOM尚未在ngOnInit中呈现，因此将找不到JQuery中的选择器，从而返回undefined。

ngAfterViewInit(): void {
    $('#daily-reports').datetimepicker();
}

Answer 2

使用declare var jQuery:any;然后在ngAfterViewInit中添加：

jQuery(this.el.nativeElement).find('div[id="daily-reports"]').datetimepicker({format: 'LT'})