如何避免错误TypeError：无法读取未定义的属性'nativeElement'？

问题描述

我试图在Angular 10中创建一个应用程序。它是一个可重用的组件。输入参数是从父组件接收的。

在.ts文件中，我有以下内容：-

export class DateTimeComponent implements OnInit {
    private _ngModel: Moment= moment();

    @Input()
    datePlaceHolder: string = "Date";

    @Input()
    timePlaceHolder: string = "Time";

    @Input()
    timeFormat:number=24;

    @Input()
    minutesGap:number=10;

    timePart: string | Moment="";

    datePart:Moment;

    constructor() {}

    ngOnInit() {
    }

    @Input()
    get ngModel() {
        return this._ngModel
    }

    @Output()
    ngModelChange = new EventEmitter <Moment>();

    set ngModel(date: Moment) {
        let m=date.minutes()+this.minutesGap-1;
        date.minutes(m  - (m % this.minutesGap));
        this.timePart = date;
        this.datePart=date;
        this._ngModel = date;
        this.ngModelChange.emit(date);
    }

    timePartChange(ev:any) {
        let d = moment(this._ngModel);
        let m=moment(ev,"LT");
        d.hours(m.hours()).minutes(m.minutes());
        this.ngModel=d;
    }

    datePartChange(ev:Moment) {
        let d = this._ngModel;
        ev.hours(d.hours()).minutes(d.minutes());
        this.ngModel=ev;
    }

}

在.html文件中，我有：-

*

<mat-form-field>
        <input matInput placeholder="{{datePlaceHolder}}" [matDatepicker]="picker" [(ngModel)]="datePart" (ngModelChange)="datePartChange($event)"/>
        <mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
        <mat-datepicker #picker></mat-datepicker>
    </mat-form-field><br/>
    
    <mat-form-field>
        <input matInput placeholder="{{timePlaceHolder}}" [format]="timeFormat"  readonly [(ngModel)]="timePart" (ngModelChange)="timePartChange($event)" [ngxTimepicker]="timepicker"/>
        <ngx-material-timepicker-toggle matSuffix [for]="timepicker"></ngx-material-timepicker-toggle>
        <ngx-material-timepicker [minutesGap]="minutesGap" #timepicker></ngx-material-timepicker>
    </mat-form-field>

但是，在控制台中，错误为：-

core.js：4197错误TypeError：无法读取未定义的属性'nativeElement' 在NgxMaterialTimepickerFaceComponent.decreaseClockHand（ngx-material-timepicker.js：1722） 在NgxMaterialTimepickerFaceComponent.setClockHandPosition（ngx-material-timepicker.js：1683） 在NgxMaterialTimepickerFaceComponent.ngOnChanges（ngx-material-timepicker.js：1564） 在NgxMaterialTimepickerFaceComponent.rememberChangeHistoryAndInvokeOnChangesHook（core.js：2131） 在callHook（core.js：3042） 在callHooks（core.js：3008） 在executeInitAndCheckHooks（core.js：2960） 在refreshView（core.js：7186） 在refreshComponent（core.js：8325） 在refreshChildComponents（core.js：6964）

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）