亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

在 Angular 中制作 editForm 最簡單的方法是什么?

在 Angular 中制作 editForm 最簡單的方法是什么?

慕碼人8056858 2023-06-09 17:52:00
在我的數據庫中,我有很多用戶,他們有很多食譜。每個食譜都有一些屬性和成分集合。因此,當用戶在頁面上顯示要編輯的配方時,應該會出現(表格)加載了當前數據的配方。這是一種工作,因為我可以看到數據,但我認為它做得不好。我的表格在沒有數組(成分)的情況下工作正常。你能告訴我應該如何將成分添加到我的編輯表單中嗎?如果您看到我的代碼并給我反饋并提示我應該更改什么,我將不勝感激。export class RecipeEditComponent implements OnInit {? @ViewChild('editForm') editForm: NgForm;? recipe: IRecipe;? photos: IPhoto[] = [];? ingredients: IIngredient[] = [];? uploader: FileUploader;? hasBaseDropZoneOver = false;? baseUrl = environment.apiUrl;??? currentMain: IPhoto;? constructor(private route: ActivatedRoute, private recipeService: RecipeService,? ? private toastr: ToastrService) { }? ngOnInit(): void {? ? this.loadRecipe();??? }? loadRecipe() {? ? this.recipeService.getRecipe(this.route.snapshot.params.id).subscribe(recipe => {? ? ? this.recipe = recipe;? ? ? this.initializeUploader();? ? })? }? updateRecipe(id: number) {? ? this.recipeService.editRecipe(id, this.recipe).subscribe(next => {? ? ? this.toastr.success('Recipe updated successfully');? ? ? this.editForm.reset(this.recipe);? ? }, error => {? ? ? this.toastr.error(error);? ? });? }}
查看完整描述

1 回答

?
叮當貓咪

TA貢獻1776條經驗 獲得超12個贊

問題是必須定義表單上的屬性name,以便 Angular 知道要更新哪個輸入。您將 name 綁定到可編輯模型設置的同一屬性,這意味著用戶可以編輯它,實際上可以刪除它,這不好。


解決方案是將其更改為不會更改的唯一值。這應該有效:


<div *ngFor="let ingredient of recipe.ingredients; let i = index">

? ? <input class="form-control" type="text" name="name{{ingredient.id}}" [(ngModel)]="ingredient.name">

? ? <input class="form-control" type="text" name="amount{{ingredient.id}}" [(ngModel)]="ingredient.amount">

? </div>

</div>

查看完整回答
反對 回復 2023-06-09
  • 1 回答
  • 0 關注
  • 167 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號