angular - 在 Angular 4 中使用 ngx-restangular 在 Http 请求中添加自定义 header

Question

我正在使用 ngx-restangular对于 Angular 4 中的 http 请求。我必须在某些事件中设置自定义 header ，从用户那里获取一些输入，然后创建 token ，将其传递给 中的 Requestheader API。

这是我用来设置自定义 header 的代码。

import { Component, OnInit } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';
import { RestangularModule, Restangular, RestangularHttp } from 'ngx-restangular';
import { RestangularConfigFactory } from '../app.module';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { AppComponent } from '../app.component';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Http, Headers, Response, RequestOptions,  } from '@angular/http';


@Component({
    templateUrl: 'login.component.html'
})

export class LoginComponent implements OnInit {
    model: any = {};
    loading = false;
    returnUrl: string;
    headers: Headers;
    options: RequestOptions;

    constructor(
        private route: ActivatedRoute,
        private router: Router,
        private restangular: Restangular) { }

    ngOnInit() {
        // reset login status
        // get return url from route parameters or default to '/'
        this.returnUrl = this.route.snapshot.queryParams['returnUrl'] || '/';
    }

    login() {
        this.loading = true;
        this.headers = new Headers();
        this.headers.append('Content-Type', 'application/json');
        this.headers.append('Authorization', 'Basic ' + btoa(this.model.username + ':' + this.model.password));
        this.options = new RequestOptions({ headers: this.headers });
        console.log(this.options);
        this.restangular.one('authentication').one('user').get([''], [this.headers]).subscribe( response => {
            console.log(response);
          });
    }
}

现在使用它我得到输出 我需要这样的东西

在下面的 desired image 图像中，您可以在 Request Header 中看到一个名为 authorization 的新字段，这是我想要实现的使用 ngx-restangular。

感谢任何帮助。

Answer 1

使用拦截器=>

RestangularProvider.addFullRequestInterceptor((element, operation, path, url, 
headers, params)=> {
   return {
     params: Object.assign({}, params, {sort:"name"}),
     headers: headers,
     element: element
   }
 });

https://github.com/2muchcoffeecom/ngx-restangular#addfullrequestinterceptor