How do I pass an URL via Angular?

Question

This is what I am trying to do but I know that the slashes are not ok in the URL

http://localhost:57101/api/employee/holiday?userName=dinchmle&Date=05/10/2018&StateVal=2

and here is my angular service code

 updateEmployee(userName: string, holiday: Holiday): Observable<Employee> {
    return this.http.put(this._employeeUrl + '/holiday?userName=' + userName + '&Date=' + holiday.date + '&StateVal=' + holiday.state, '')
    .map((res: Employee) => res)
    .catch(this.handleError);
  }

what is the difficulty ?

Rakesh Chand
– Rakesh Chand

2018-10-15 11:08:42 +00:00
Commented Oct 15, 2018 at 11:08 — Rakesh Chand
– Rakesh Chand, Commented Oct 15, 2018 at 11:08

Sunil · Accepted Answer · 2018-10-15 11:10:42Z

1

Just encode your url by using encodeURI function. This will take of all special characters in your URL.

 updateEmployee(userName: string, holiday: Holiday): Observable<Employee> {
    let url = this._employeeUrl + '/holiday?userName=' + userName + '&Date=' + holiday.date + '&StateVal=' + holiday.state;

    return this.http.put(encodeURI(url), '') // encode URL
    .map((res: Employee) => res)
    .catch(this.handleError);
  }

answered Oct 15, 2018 at 11:10

Sunil

11.3k2 gold badges29 silver badges48 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Tommy · Accepted Answer · 2018-10-15 11:14:29Z

You could escape the slashes as %2F.

Here is the edited example:

updateEmployee(userName: string, holiday: Holiday): Observable<Employee> {
    let parsedDate = Date.parse(holiday.date);
    let month = parsedDate.getUTCMonth() + 1; //months from 1-12
    let day = parsedDate.getUTCDate();
    let year = parsedDate.getUTCFullYear();

    return this.http.put(this._employeeUrl + '/holiday?userName=' + userName + '&Date=' + day + '%2F' + month + '%2F' + year + '&StateVal=' + holiday.state, '')
        .map((res: Employee) => res)
        .catch(this.handleError);
}

Collectives™ on Stack Overflow

How do I pass an URL via Angular?

2 Answers 2

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Related