代码之家  ›  专栏  ›  技术社区  ›  Muthukumar Marichamy

nativescript angular在http服务调用之后,视图未更新(angular 5)

  •  2
  • Muthukumar Marichamy  · 技术社区  · 8 年前

    nativescript angular在http服务调用之后,视图未更新(angular 5)。

    在下面的代码中找到我编写http服务调用的地方,然后将响应分配给视图,该视图不会在视图页面中更新。如果我执行任何其他事件,如鼠标悬停文本框,则视图将被更新。 componet.ts文件

    this.orderService.getProductBySKU('DR1056.01534XXL')
        .subscribe(resProduct => {
            this.ngZone.run(() => {
                this.processing = false;                
             });
        }
    

    服务文件

    getProductBySKU(sku) {
        const authToken = localStorage.getItem('currentUserToken');
        return this.http.get(this.config.apiUrl + 'get-product-by-sku?sku=' + sku, this.config.basicAuth())
     .map(response => response);
    

    }

    注意:默认情况下,this.processing在视图中显示的构造函数中被指定为true,在服务调用后this.processing被指定为false,但它只显示true。如果单击任何文本框或按钮,则在视图中将this.processing更改为false。

    1 回复  |  直到 8 年前
        1
  •  3
  •   Eduardo Speroni    8 年前

    首先,我建议使用httpclient params选项来避免潜在的url转义问题:

    this.http.get(this.config.apiUrl + 'get-product-by-sku', {...this.config.basicAuth(), params: { sku: sku }})
    

    ```

    对于处理,请尝试强制进行更改检测:

    constructor(private ref: ChangeDetectorRef) {}
    (...)
    this.orderService.getProductBySKU('DR1056.01534XXL')
        .subscribe(resProduct => {
            this.ngZone.run(() => {
                this.processing = false;                
                this.ref.detectChanges();
             });
        }
    

    如果这不起作用,请提供您的模板片段。