gpt4 book ai didi

angular - 除了在 ngAfterViewInit() 上使用它之外,有没有办法在组件上使用 NgbDatepicker 的 navigateTo()?

转载 作者:行者123 更新时间:2023-12-04 08:56:42 24 4
gpt4 key购买 nike

我正在使用 NgbDatepicker

<ngb-datepicker #dp [(ngModel)]="scheduledStartDate" [ngModelOptions]="{standalone:true}">
</ngb-datepicker>
可以在 ngAfterViewInit() 上完成喜欢:
@ViewChild('dp') datepicker: NgbDatepicker;

ngAfterViewInit() {
this.datepicker.navigateTo({ year: new Date().getFullYear(), month: new Date().getMonth(), day: new Date().getDate() });
}
但是有没有办法使用 navigateTo()在其他一些功能上??

最佳答案

您不能使用 NgbDatepicker直到它被初始化。为了确保它可用,我们有 ngAfterViewInit钩。所以如果你想做一些初始化,你可以在 ngAfterViewInit 中进行。 .但是如果你仍然想从之前调用的某个函数中使用它 view initialisation (假设是构造函数,因为你没有告诉我们你从哪里调用它),你可以使用 setTimeout作为一种解决方法,但我不建议这样做。例如,请参见下面的组件 -

@Component({
selector: 'my-app',
templateUrl: './app.component.html'
})
export class AppComponent implements AfterViewInit {

@ViewChild('dp') datepicker: NgbDatepicker;
scheduledStartDate: NgbDateStruct = {year: 2222, month: 10, day: 10};
constructor(private calendar: NgbCalendar) {
console.log(this.datepicker? 'NgDatePicker is available': 'NgDatePicker not initialized');
setTimeout(() => {
this.datepicker.navigateTo({year:2090, month: 10});
}, 1000);
}
ngAfterViewInit() {
console.log(this.datepicker? 'NgDatePicker is available': 'NgDatePicker not initialized');
}
}
请查收 this stackblitz工作正常的例子。 app.component.html有两个按钮可以导航到两个不同的年份。
更新 :
您也可以使用 startDate在您的 <ngb-datepicker> ——
<div *ngIf="addEditForm">
<ngb-datepicker #dp [(ngModel)]="scheduledStartDate" [startDate]="scheduledStartDate" (navigate)="date = $event.next" *ngIf="addEditForm"></ngb-datepicker>
</div>
然后不断变化 scheduledStartDate而不是使用 this.datepicker.navigateTo({})
openAddForm() {
this.addEditForm = true;
this.scheduledStartDate = {year: 5555, month: 10, day: 10};
}
引用 this api document了解更多。

关于angular - 除了在 ngAfterViewInit() 上使用它之外,有没有办法在组件上使用 NgbDatepicker 的 navigateTo()?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/63788133/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com