Adding Authorization Header to subsequent calls

[Yusef]

I have an Angular App that muss send an authorization header within every request that makes to the server.

When defining the kendo datasource, I've added the header field:

this._tableData = new kendo.data.DataSource({
      transport: {
        read: {
          cache: true,
          url: `${this.baseUrl}/uiobjects/_search`,
          dataType: "json",
          contentType: "application/json; charset=utf-8",
          type: "POST",
          headers: {'Authorization': this.header}
        },

Allowing me to fill the kendo grid with data, but for one of the rows I've defined a template:

template: `<div class='title'><div class='pic'><img src="#:_links.previewdata.href#" alt="thumbnail"></div><span>#: title #</span></div>`

and there makes another request to the server in order to grab the image. 

My problem here, is that I am not being able to set this authorization header for these request. Angular interceptors doesn't work because they are not made through $http.

Is there any clean way to intercep these request, or to add a Header??

[Petyo]

Hi,

I may suggest that you use the following approach to pass the datasource request through the $http service.

Regards,
Petyo
Telerik