Angular: How to delete multiple data using http.delete or http.request

Question

I can delete an item when mocking the server with the code below:

 var result = <Promise<ArrayBuffer>> this.http
      .request('delete', `api/accounts/1`)
      .toPromise();

I want to delete multiple items but want to do it in batch instead of separated

var result = <Promise<ArrayBuffer>> this.http
            .request('delete', `api/accounts`, { 
                headers: new HttpHeaders({
                    'Content-Type': 'application/json',
                  }),
                body
             })
            .toPromise();

This give me an error "Not Found"

core.js:4197 ERROR Error: Uncaught (in promise): Object: {"body":{"error":"Missing \"accounts\" id"},"url":"api/accounts","headers":{"normalizedNames":{},"lazyUpdate":null},"status":404,"statusText":"Not Found"}
    at resolvePromise (zone-evergreen.js:798)
    at resolvePromise (zone-evergreen.js:750)
    at zone-evergreen.js:860
    at ZoneDelegate.invokeTask (zone-evergreen.js:399)
    at Object.onInvokeTask (core.js:27424)
    at ZoneDelegate.invokeTask (zone-evergreen.js:398)
    at Zone.runTask (zone-evergreen.js:167)
    at drainMicroTaskQueue (zone-evergreen.js:569)
    at invokeTask (zone-evergreen.js:484)
    at ZoneTask.invoke (zone-evergreen.js:469)  

Answer 1

You may refer to how the following work:

1. ForkJoin
2. MergeMap

You may refer to the following blog for details: Angular Multiple HTTP Requests with RxJS