Why is the data update method not working?

Question

JavaScript

I want to update post information in GalleryService using "update" method. When I click the "Edit" button, I go to the address of the selected post, its data is in the input fields. After I change something in the fields and click on the "Update Post" button to change the post data, my form closes, but no changes occur. There are no errors, changes do not occur in the database, all other methods work (changes occur in the database), in the console I checked the data that I send and ID, everything converges. As a server I use: "json-server". Help me solve this problem and understand what I'm doing wrong
Edit button in the GalleryItemComponent component:

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

Form in 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']);
        });
    }
}

Service:

export class GalleryService {
    galleryUrl: string = 'http://localhost:5555/posts';
    httpOptions: object = {
        headers: new HttpHeaders({'Content-Type': 'application/json'})
    };
    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
        };
        console.log(`${this.galleryUrl}/${id}`);
        console.log(postEdObj);
        return this.http.put<Picture>(`${this.galleryUrl}/${id}`, postEdObj, this.httpOptions);
    }
}

Answer 1

Instead of this

put

you can just use

post or get

And on the back side, check if there is such an ID, then do an update there.
And if not, then you can even do Insert!
It is possible through one method to kill two birds with one stone.