[英]Dates not binding in Angular
我正在為我的 Web 應用程序使用 Angular 7,並且在 html 中有以下代碼:
<div class="form-group col-md-6">
<label for="myDate">My Date</label>
<div class="input-group">
<input
class="form-control"
placeholder="yyyy/mm/dd"
id="myDate"
name="myDate"
[ngModel]="project.myDate | date: 'yyyy/MM/dd'"
ngbDatepicker #d="ngbDatepicker"
tabindex="9">
<div class="input-group-append">
<button class="btn btn-outline-secondary calendar" (click)="d.toggle()" type="button"></button>
</div>
</div>
</div>
在調用 Web API 時,我得到了一個像這樣的 JSON 對象:
{
"id": 11,
"description": "This is a test description",
"budget": 1000,
"myDate": "2020/02/11",
...
}
這是組件代碼:
export class ProjectEditComponent implements OnInit {
project: Project;
errorMessage: string;
constructor(private myprojectService: ProjectService) { }
ngOnInit() {
this.myprojectService.getDataById(this.dataId).subscribe(
data => (this.project = data, console.log(JSON.stringify(data))),
error => this.errorMessage = error as any,
);
console.log(this.errorMessage);
}
}
除 myDate 屬性外,所有屬性都已正確綁定。
我做了一些研究並嘗試了不同的建議解決方案,但到目前為止似乎沒有一個工作。
你們中有人遇到過類似的事情嗎?
要進行雙向綁定,您應該首先確保已將FormsModule
導入到@NgModule
中的app.module.ts
。
app.module.ts:
import { BrowserModule } from "@angular/platform-browser";
import { NgModule } from "@angular/core";
import { AppComponent } from "./app.component";
//import this.
import { FormsModule } from "@angular/forms";
@NgModule({
declarations: [AppComponent],
imports: [BrowserModule, FormsModule], //register it
providers: [],
bootstrap: [AppComponent]
})
export class AppModule {}
然后,在 html 文件中使用[(ngModel)]
:
<div class="form-group col-md-6">
<label for="myDate">My Date</label>
<div class="input-group">
<input
class="form-control"
placeholder="yyyy/mm/dd"
id="myDate"
name="myDate"
[(ngModel)]="project.myDate"
ngbDatepicker #d="ngbDatepicker"
tabindex="9">
<div class="input-group-append">
<button class="btn btn-outline-secondary calendar" (click)="d.toggle()" type="button"></button>
</div>
</div>
</div>
我移除了管道,因為使用兩種方式 bindind 給了我錯誤。 檢查該線程以進行鍛煉。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.