带有角度的 Nativescript 不执行 Http 请求答案

【问题标题】：Nativescript with angular not performing Http Requests带有角度的 Nativescript 不执行 Http 请求
【发布时间】：2019-06-12 00:35:53
【问题描述】：

我正在尝试在我的 nativescript 应用程序上执行 http 请求，但是当调用 http.get() 时，我什么也得不到，没有错误，也没有调用 api。

servicos.component.ts


    private servicos: Observable<Servico[]>;

    constructor(
        private servicosService: ServicosService
    ) {
        // Use the component constructor to inject providers.
        this.servicos = this.servicosService.listar();

    }

    ngOnInit(): void {
        // Init your component properties here.



    }

servicos.service.ts

@Injectable()
export class ServicosService{
    constructor(private http: HttpClient){

    }

    listar(){
        return this.http.get<any>(
            CONSTANTS.SERVER_URL + '/servicos/'
        );
    }
}

【问题讨论】：

标签： nativescript nativescript-angular

【解决方案1】：

您正在创建请求，但从不订阅它！你有几个选择：

手动订阅并更新servicos

    private servicos: Servico[];

    constructor(
        private servicosService: ServicosService
    ) {
        // Use the component constructor to inject providers.
        this.servicos = this.servicosService.listar().subscribe((response) => this.servicos = response);

    }

保持相同的代码，但在您的 html 中使用 async 管道（小心！每次显示此屏幕时它都会调用您的 api，并且会多次调用多个 asyncs）

<Label [text]="servico.text" *ngFor="let servico of servicos | async"></Label>

上下文：

HttpClient 请求总是从 rxjs 返回 Observable。

Observables 是冷对象，这意味着它们不会执行任何代码，直到有人 subscribes 给它。相反，Promises 总是在它被声明的时候执行。

考虑代码：

const request = new Promise((resolve, reject) => {
    console.log("executing");
    resolve();
});

setTimeout(() => request.then(() => console.log("success")), 1000)

结果

executing
- 1s wait -
success

现在使用Observable：

const request = new Observable((subscriber) => {
    console.log("executing");
    subscriber.next();
    subscriber.complete();
});

setTimeout(() => request.subscribe(() => console.log("success")), 1000)

结果：

- 1s wait -
executing
success

async 管道本质上在“渲染”时调用 subscribe，在销毁时调用 unsubscribe，因此您不必自己管理它。

【讨论】：