0

メソッドGalleryServiceを使用して投稿に関する情報を更新したい。updateボタンをクリックするEditと、選択した投稿のアドレスに移動します。そのデータは入力フィールドにあります。フィールドで何かを変更し、Update Postボタンをクリックして投稿を変更した後、フォームは閉じますが、変更は行われません。エラーもありません。私の問題が何であるかを教えて、それを解決してください。

EditコンポーネントのボタンGalleryItemComponent:

<a class="btn btn-success ed"  [routerLink] = "['/galleryEdit', pic.id]"  (click)="editPost(pic)">Edit</a>

フォームGalleryEditComponent:

    <form [formGroup]="angFormEd" novalidate>

        <input type="text" class="form-control" formControlName="titleEd"  #titleEd
               [(ngModel)]="post.title"/>

        <input type="url" class="form-control" formControlName="urlEd" #urlEd pattern="https?://.+"
               title="Include http://" [(ngModel)]="post.url"/>
 
        <button (click)="updatePost(titleEd.value, urlEd.value)"  
                [disabled]=" angFormEd.invalid">
                btn btn-primary">Update Post</button>     
    </form>

GalleryEditComponent.ts:

export class GalleryEditComponent implements OnInit {
    post: Picture;
    constructor(private fb: FormBuilder,
                private route: ActivatedRoute, private galleryService: GalleryService) {
    }

    ngOnInit() {
        this.editPost();
    }

    editPost(): void {
        this.route.params.subscribe(params => {
            this.galleryService.edit(params['id']).subscribe(res => {
                this.post = res;
            })
        })
    }

    updatePost(title: string, url: string): void {
        this.route.params.subscribe(params => {
            this.galleryService.update(title, url, params['id']);
        });
    }
}

** GalleryService.ts:**

const httpOptions = {
  headers: new HttpHeaders({'Content-Type': 'application/json'})
};

export class GalleryService {
    galleryUrl: string = 'http://localhost:5555/posts';
    Mycollection: Picture[] = myCollection;

    constructor(private http: HttpClient) {
    }

    getPictures(): Observable<Picture[]> {
        return this.http.get<Picture[]>(`${this.galleryUrl}`);
    }

    edit(id:number): Observable<Picture> {
        return this.http.get<Picture>(`${this.galleryUrl}/${id}`);
    }

    update(title: string, url: string, id: number): Observable<Picture> {
        const postEdObj = {
          title,
            url
        };
        return this.http.put<Picture>(`${this.galleryUrl}/${id}`, postEdObj, httpOptions);
    }
}

4

0 に答える 0