Javascript jQuery UI日期选择器更改事件不发生';不要用角2射击

Javascript jQuery UI日期选择器更改事件不发生';不要用角2射击,javascript,jquery,angular,typescript,Javascript,Jquery,Angular,Typescript,我正在尝试在Angular 2应用程序中使用jQuery datepicker。我创建了一个如下的指令 import {Directive, ElementRef, AfterViewInit, EventEmitter, Output} from '@angular/core'; require('./jquery.weekpicker.js'); declare var $; @Directive({ selector: '.week-picker' }) export clas

我正在尝试在Angular 2应用程序中使用jQuery datepicker。我创建了一个如下的指令

import {Directive, ElementRef, AfterViewInit, EventEmitter, Output} from '@angular/core';
require('./jquery.weekpicker.js');

declare var $;

@Directive({
    selector: '.week-picker'
})
export class WeekPickerDirective implements AfterViewInit{
    private htmlElement:HTMLElement;

    @Output()
    change:EventEmitter<any> = new EventEmitter();

    constructor(private element:ElementRef) {
        this.htmlElement = this.element.nativeElement;
    }

    ngAfterViewInit() {
        $(this.htmlElement).weekpicker({
            onSelect: (dateText) => {
                this.change.emit(dateText);
            }
        });
    }
}
<input class="week-picker" [ngModel]="departureWeek" (ngModelChange)="departureWeekChanged($event)">
应用程序组件.ts

(function ($) {
    var $calroot;

    function selectCurrentWeek() {
        window.setTimeout(function () {
            var t = $calroot.find('.ui-datepicker-current-day a');//.addClass('ui-state-active');
            t = t.closest('tr');
            t.find('td>a').addClass('ui-state-active');//.parent().addClass('ui-state-active');
        }, 1);
    }

    function onSelect(dateText, inst) {
        var date = $(this).datepicker('getDate');
        var dateFormat = "D, d M, yy";
        var week;

        startDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay() + 1);
        endDate = new Date(date.getFullYear(), date.getMonth(), date.getDate() - date.getDay() + 7);
        week = $.datepicker.iso8601Week(new Date(dateText));

        $(this).val($.datepicker.formatDate(dateFormat, startDate));

        $calroot.trigger('weekselected', {
            start: startDate,
            end: endDate,
            weekOf: startDate
        });
        selectCurrentWeek();
    }

    var reqOpt = {
        onSelect: onSelect,
        showOtherMonths: true,
        selectOtherMonths: true,
        showWeek: true,
        firstDay: 1
    };

    $.fn.weekpicker = function () {
        var $this = this;
        $calroot = $this;

        $this.datepicker(reqOpt);

        $dprow = $this.find('.ui-datepicker');

        $dprow.on('mousemove', 'tr', function () {
            $(this).find('td a').addClass('ui-state-hover');
        });
        $dprow.on('mouseleave', 'tr', function () {
            $(this).find('td a').removeClass('ui-state-hover');
        });
    };
})(jQuery);
import {Component, OnInit,  ViewChild, ElementRef, AfterViewInit} from '@angular/core';
declare var $;
require('./shared/libs/weekpicker/jquery.weekpicker.js');

@Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit{
    private departureWeek:any;
    private currentDate = new Date().toLocaleDateString();

    ngOnInit() {
        this.departureWeek = this.currentDate;
    }

    constructor() {}

    private departureWeekChanged(newValue):void {
        console.log('departureWeekChanged');
        console.log(newValue);
    }
}
但datepicker更改事件不会触发

有什么建议吗

多谢各位