这段代码中没有发生 Http 调用？

Question

核心服务：

export class CoreService {

  constructor(private _http: HttpClient) { 
    Common.Socket.next('https://reqres.in');
  }

  httpget(url): any {
    return Common.Socket
    .switchMap((x)=> this._http.get( x + url));
  }
  httppost(url, body): any {
    return Common.Socket
    .switchMap((x)=> this._http.post( x + url, body, 
    {headers: this.createAuthorizationHeader()}
    ));
  }

  private createAuthorizationHeader() {
    const headers = new HttpHeaders({'Content-Type':'application/json'});
    return headers;
  }
}

组件服务：

export class AppServiceService {

      constructor( private _coreService: CoreService) { }
      getAll(path: string){
        return this._coreService.httpget(path);
      }
     getParticular(url){
        return this._coreService.httpget(url);
      }
      create(url, body) {
        return this._coreService.httppost(url, body);
      }
    }

APP模块：

@NgModule({
  imports:      [ BrowserModule, FormsModule, HttpClientModule ],
  declarations: [ AppComponent ],
  bootstrap:    [ AppComponent ],
  providers: [CoreService]
})
export class AppModule { }

应用组件

    export class AppComponent  implements OnInit {
      name = 'Angular 5';
      public allPosts: any;
      constructor(private _appServiceService: AppServiceService) {
      }
      ngOnInit(): void {
        this.getAllPosts();
      }
      private getAllPosts(): void {
        this._appServiceService.getAll('/api/users?page=2').subscribe(
          (res) => {
            this.allPosts = res;
            console.log(this.allPosts, 'allposts');
          }
        );
      }
      getParticular(): void {
        this._appServiceService.getParticular('/api/users/2').subscribe(
          (res) => {
            this.allPosts = res;
            console.log(this.allPosts, 'allposts');
          }
        );
      }
createMessage() {
    const url = '/api/users';
    const body = { 'name': 'morpheus-1','job': 'leader'};
    this._appServiceService.create(url, body).subscribe(
      (x) => {
        console.log(x);
      }
    );
  }
    }

iam 从 app.component.html 中的 click 事件调用 create 和 getparticular。当我发出请求时，核心服务没有发出 http 调用。请为此提供解决方案。我认为 rxjs 导致了这个问题。 我在这里转载->https://stackblitz.com/edit/angular-rcxgxv.

Answer 1

当你添加时它正在工作

Common.Socket.next('https://reqres.in');

在 CoreService 的每个函数中。 而不是使用主题作为 url 只是使用字符串。

import { Subject } from 'rxjs/Subject';
export class Common {
  static Socket = "https://reqres.in";
}

然后在CoreService中添加一些改动：

@Injectable()
export class CoreService {

  constructor(private _http: HttpClient) { 
  }

  httpget(url): any {
    return this._http.get( Common.Socket.toString() + url);
  }
  httppost(url, body): any {
    return this._http.post(Common.Socket.toString() + url, body,  
    {headers: this.createAuthorizationHeader()}
    );
  }

  private createAuthorizationHeader() {
    const headers = new HttpHeaders({'Content-Type':'application/json'});
    return headers;
  }
}

同样在 AppComponent 中，当您发布消息时添加订阅功能，因为当 http.post 上没有订阅或承诺时，Angular 4 不会发送帖子请求

  createMessage() {
    const url = '/api/users';
    const body = { 'name': 'morpheus-1', 'job': 'leader' };
    this._appServiceService.create(url, body).subscribe();
  }