Почему метод обновления данных не работает? - PullRequest
Новая
       7

Почему метод обновления данных не работает?

0 голосов
/ 08 октября 2018

Я хочу обновить информацию о записи в 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);
    }
}
...