Question

CoreService：

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会导致这个问题。我在这里转载 - ＆gt; https://stackblitz.com/edit/angular-rcxgxv

Answer 1

添加

时，它正在运行

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

在CoreService中的每个函数中。而不是使用Subject作为url，只需使用string。

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中发布消息添加订阅功能，因为Angular 4在http.post上没有订阅或承诺时不发送帖子请求

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

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

1 个答案: