#angular #crud #angular12
Вопрос:
Я пытаюсь создать простое приложение CRUD на основе angular 12, используя этот сервис URI — https://api.github.com/repos/angular/angular/issues
У меня есть такая модель:
export class Issue {
id: number;
title: string;
state: string;
url: string;
created_at: string;
updated_at: string;
author_association: string;
}
в app.component.html У меня есть столбец компонента таблицы в следующем виде:
<ng-container matColumnDef="author_association">
<mat-header-cell *matHeaderCellDef mat-sort-header>Author Association</mat-header-cell>
<mat-cell *matCellDef="let row"> {{row.author_association}}</mat-cell>
</ng-container>
Данные отображаются в таблице просто отлично, как показано ниже:
Также есть два компонента диалогового окна (удаление/редактирование).
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
import {Component, Inject} from '@angular/core';
import {DataService} from '../../services/data.service';
@Component({
selector: 'app-delete.dialog',
templateUrl: '../../dialogs/delete/delete.dialog.html',
styleUrls: ['../../dialogs/delete/delete.dialog.css']
})
export class DeleteDialogComponent {
constructor(public dialogRef: MatDialogRef<DeleteDialogComponent>,
@Inject(MAT_DIALOG_DATA) public data: any, public dataService: DataService) { }
onNoClick(): void {
this.dialogRef.close();
}
confirmDelete(): void {
this.dataService.deleteIssue(this.data.id);
}
}
И
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
import {Component, Inject} from '@angular/core';
import {DataService} from '../../services/data.service';
import {FormControl, Validators} from '@angular/forms';
@Component({
selector: 'app-baza.dialog',
templateUrl: '../../dialogs/edit/edit.dialog.html',
styleUrls: ['../../dialogs/edit/edit.dialog.css']
})
export class EditDialogComponent {
constructor(public dialogRef: MatDialogRef<EditDialogComponent>,
@Inject(MAT_DIALOG_DATA) public data: any, public dataService: DataService) { }
formControl = new FormControl('', [
Validators.required
// Validators.email,
]);
getErrorMessage() {
return this.formControl.hasError('required') ? 'Required field' :
this.formControl.hasError('email') ? 'Not a valid email' :
'';
}
submit() {
// emppty stuff
}
onNoClick(): void {
this.dialogRef.close();
}
stopEdit(): void {
this.dataService.updateIssue(this.data);
}
}
Проблема:
Данные для ассоциации авторов отсутствуют в обоих приведенных выше диалоговых окнах. Например:
Вопрос: Чего мне здесь не хватает? Или что я здесь делаю не так?
При необходимости я могу предоставить более подробную информацию. А также прямой готовый к запуску проект доступен здесь.
Ответ №1:
строка.author_association отсутствует в функции startEdit (). Добавьте строку.author_association в щелчок кнопки, чтобы решить вашу проблему
<button mat-icon-button color="accent" (click)="startEdit(i, row.id, row.title, row.state, row.url, row.created_at, row.updated_at, row.author_association)">