代码之家  ›  专栏  ›  技术社区  ›  nonzod

NativeScript HttpClient和Observable

  •  0
  • nonzod  · 技术社区  · 7 年前

    我正试图向HttpClient发出一个GET请求,我希望返回一个Observable。

    问题是HttpClient没有向服务器发出请求,如果使用subscribe,则请求会正确完成。 我通过检查nginx访问进行了检查。日志文件,没有subscribe()没有向服务器发送请求,我得到一个空的Observable。

    没有错误,没有警告,但没有调用服务器。。。 我哪里做错了?

    tns版本: 3.4.1

    应用程序。模块。ts

    import { NgModule, NO_ERRORS_SCHEMA } from "@angular/core";
    import { NativeScriptModule } from "nativescript-angular/nativescript.module";
    import { NativeScriptFormsModule } from "nativescript-angular/forms"; 
    import { NativeScriptHttpClientModule } from "nativescript-angular/http-client"; // Nuovo modulo angular HTTP
    
    import { Database } from "./providers/database/database";
    import { HttpErrorInterceptorProvider } from "./common/http_error_interception";
    
    import { AppRoutingModule } from "./app.routing";
    
    import { AppComponent } from "./app.component";
    import { UserComponent } from "./user/user.component";
    
    @NgModule({
        bootstrap: [
            AppComponent
        ],
        imports: [
            NativeScriptHttpClientModule,
            NativeScriptModule,
            NativeScriptFormsModule,
            AppRoutingModule
        ],
        declarations: [
            AppComponent,
            UserComponent
        ],
        providers: [
            HttpErrorInterceptorProvider
        ],
        schemas: [
            NO_ERRORS_SCHEMA
        ]
    })
    
    export class AppModule { }
    

    使用者ts

    export interface User {
      "id": number,
      "email": string,
      "profile_type": string,
      "status": number,
      "token_access": string,
      "profile": Array<any>,
      "type" : string,
      "cached_at" : number
    }
    

    使用者服务ts

    import { HttpClient, HttpHeaders, HttpParams } from "@angular/common/http";
    import { Injectable } from "@angular/core";
    import { Observable } from 'rxjs/Observable';
    
    import * as ApplicationSettings from "application-settings";
    
    import { User } from "./user";
    
    @Injectable()
    export class UserService {
      constructor(
        private _http: HttpClient
      ) { }
    
      getUser(): Observable<User> {
        let headers = new HttpHeaders({
          "Content-Type": "application/json",
          "Accept": "application/json",
          "Authorization": "Bearer 1234567890"
        });
    
        let params = new HttpParams().set('expand', 'profile');
    
        return this._http.get<User>('http://localhost:8080/v1/customer/user/me', { headers:headers, params: params });
      }
    }
    

    使用者组成部分ts

    import { Component, OnInit } from "@angular/core";
    import { RouterExtensions } from "nativescript-angular/router";
    import { Database } from "../providers/database/database";
    import * as ApplicationSettings from "application-settings";
    
    import { User } from "./user";
    import { UserService } from "./user.service";
    import { Observable } from 'rxjs/Observable';
    
    @Component({
      selector: "ns-user",
      moduleId: module.id,
      providers: [ UserService ],
      templateUrl: "./user.html",
    })
    export class UserComponent implements OnInit {
      public user: Observable<User>;
    
      constructor(
        private router: RouterExtensions,
        private userService: UserService
      ) { }
    
      public ngOnInit(): void {
        // tbd
      }
    
      public onTap(): void {
        console.log("TAP!");
        this.user = this.userService.getUser();
      }
    }
    
    1 回复  |  直到 7 年前
        1
  •  1
  •   mast3rd3mon    7 年前

    要使(角度)Http调用工作,您需要订阅该事件,否则该调用仅被声明,而从未实际调用。订阅还可以在收到错误时返回错误,以及在调用成功时返回完成事件