NativeScript单向数据绑定不'；t更新视图

这对我来说似乎是一个非常简单的案例，但我显然遗漏了一些东西。我有一个模型要绑定到视图。然后用Http调用加载模型。为什么视图不更新？我认为这就是单向绑定的全部意义

我已经验证了我正在从http调用中获取预期的数据

更新 我在屏幕上添加了一个按钮，数据绑定实际上会使用按钮按钮上两个字段的http加载数据更新屏幕，即使button方法只设置其中一个值。因此，要么NativeScript中存在错误，要么我没有做错事

更新2只需单击按钮即可触发绑定。我修改了代码，使之有一个空的tap处理程序，只需单击该按钮即可使其绑定

打字稿

import { Component, ChangeDetectionStrategy, OnInit } from "@angular/core";
import { Job } from "../../shared/customer/job";
import { Http, Headers, Response } from "@angular/http";
import { Observable } from "rxjs/Rx";

@Component({
    selector: "my-app",
    templateUrl: "pages/job-details/job-details.html",
    changeDetection: ChangeDetectionStrategy.OnPush
})

export class JobDetailsComponent implements OnInit {
    job: Job;
    salesAssociateName: string = "x";

    constructor(private http: Http) {
        this.job = new Job();
    }

    ngOnInit() {
        this.getJob(1234);
    }

    getJob(leadId: number) {
        var url = "https://url-not-for-you/job?franchiseeid=48&leadid=" + leadId;
        var headers = this.createRequestHeader();

        this.http.get(url, { headers: headers }).map(response => response.json())
            .do(data => this.setData(data[0]))
            .subscribe(
                () => this.success(),
                (error) => this.error()
            );
    }

    private createRequestHeader() {
        let headers = new Headers();
        headers.append("AuthKey","blah");
        headers.append("AuthToken", "blee");

        return headers;
    }

    setData(job) {
        this.job.FullName = job["FullName"];
        this.job.SalesAssociateName = job["SalesAssociateName"];
        this.salesAssociateName = this.job.SalesAssociateName;

        console.log("Found job for customer: " + job["FullName"]);
    }

    success() {
        // nothing useful
    }

    error() {
        alert("There was a problem retrieving your customer job.");
    }

    changeSA() {
    }
}

html

---

使用默认的ChangeDetectionStrategy，您的代码将按预期工作。但是，您已将策略更改为onPush

为了使您的绑定按照默认changeStrategy中的预期工作，请删除以下行

changeDetection: ChangeDetectionStrategy.OnPush

或者改成

changeDetection: ChangeDetectionStrategy.Default

更多关于Angular-2 ChangeDetection策略和

如果您仍然希望使用onPush而不是默认策略，那么您的属性应该声明为@input（），并且一旦进行了更改（在setData中），就用标记

当从按钮点击触发时，绑定工作的原因是 应用程序状态更改可以通过以下方式触发：

• 事件-轻按、轻扫、
• XHR-从远程服务器获取数据
• 计时器-例如setTimeout（）

出于测试目的，如果有人对如何使用onPush实现场景感兴趣，这里有一个示例代码：

import { Component, ChangeDetectionStrategy, ChangeDetectorRef, OnInit, NgZone, Input } from "@angular/core";
import { Http, Headers, Response } from "@angular/http";
import { Observable as RxObservable } from "rxjs/Rx";
import "rxjs/add/operator/map";
import "rxjs/add/operator/do";

@Component({
    selector: "my-app",
    templateUrl: "app.component.html",
    changeDetection: ChangeDetectionStrategy.OnPush
})
export class AppComponent implements OnInit {
    @Input() public job: any = { salesAssociateName: "default job" };
    @Input() public salesAssociateName: string = "default name";


    constructor(private http: Http, private change:ChangeDetectorRef) { }

    ngOnInit() {
        this.getJob();
    }

    getJob() {
        var url = "http://httpbin.org/get";
        var headers = this.createRequestHeader();

        this.http.get(url, { headers: headers })
            .map(response => response.json())
            .do(data => {
                this.setData();
            }).subscribe(
                () => this.success(),
                (error) => this.error()
            );
    }

    private createRequestHeader() {
        let headers = new Headers();
        return headers;
    }

    setData() {

        this.job.salesAssociateName = "NEW job SalesAssociateName";
        this.salesAssociateName = "NEW job FullName";
        this.change.markForCheck();
    }

    success() {
        alert("success");
    }

    error() {
        alert("There was a problem retrieving your customer job.");
    }
}

---

您的代码将使用默认的ChangeDetectionStrategy按预期工作。但是，您已将策略更改为onPush

为了使您的绑定按照默认changeStrategy中的预期工作，请删除以下行

changeDetection: ChangeDetectionStrategy.OnPush

或者改成

changeDetection: ChangeDetectionStrategy.Default

更多关于Angular-2 ChangeDetection策略和

如果您仍然希望使用onPush而不是默认策略，那么您的属性应该声明为@input（），并且一旦进行了更改（在setData中），就用标记

当从按钮点击触发时，绑定工作的原因是 应用程序状态更改可以通过以下方式触发：

• 事件-轻按、轻扫、
• XHR-从远程服务器获取数据
• 计时器-例如setTimeout（）

出于测试目的，如果有人对如何使用onPush实现场景感兴趣，这里有一个示例代码：

import { Component, ChangeDetectionStrategy, ChangeDetectorRef, OnInit, NgZone, Input } from "@angular/core";
import { Http, Headers, Response } from "@angular/http";
import { Observable as RxObservable } from "rxjs/Rx";
import "rxjs/add/operator/map";
import "rxjs/add/operator/do";

@Component({
    selector: "my-app",
    templateUrl: "app.component.html",
    changeDetection: ChangeDetectionStrategy.OnPush
})
export class AppComponent implements OnInit {
    @Input() public job: any = { salesAssociateName: "default job" };
    @Input() public salesAssociateName: string = "default name";


    constructor(private http: Http, private change:ChangeDetectorRef) { }

    ngOnInit() {
        this.getJob();
    }

    getJob() {
        var url = "http://httpbin.org/get";
        var headers = this.createRequestHeader();

        this.http.get(url, { headers: headers })
            .map(response => response.json())
            .do(data => {
                this.setData();
            }).subscribe(
                () => this.success(),
                (error) => this.error()
            );
    }

    private createRequestHeader() {
        let headers = new Headers();
        return headers;
    }

    setData() {

        this.job.salesAssociateName = "NEW job SalesAssociateName";
        this.salesAssociateName = "NEW job FullName";
        this.change.markForCheck();
    }

    success() {
        alert("success");
    }

    error() {
        alert("There was a problem retrieving your customer job.");
    }
}

---

实际上，在nativescript中，

onPush

，可观察到的输入不起作用或有时起作用。不知道为什么。这种方法现在在NativeScript 5.1和angular 7中仍然有效吗？事实上，可观察的输入不起作用，或者在NativeScript中的

onPush

中不时起作用。不知道为什么。这个方法现在在NativeScript 5.1和angular 7中仍然有效吗？