将动态 json 绑定到输入控件的问题，视图未使用最新/动态数据刷新答案

【问题标题】：Issues in binding dynamic json to input controls, view is not getting refreshed with latest/dynamic data将动态 json 绑定到输入控件的问题，视图未使用最新/动态数据刷新
【发布时间】：2016-07-23 20:29:50
【问题描述】：

我无法将动态数据绑定到输入控件，但静态数据已正确绑定到相同的控件。动态数据被检索，我可以使用 console.log 查看数据。但值不受约束。带有数据显示的浏览器控制台快照我正确绑定的静态数据如下所示

const SAMPLE = { queueId: 11, name: 'Mr. Nice' };
constructor(){
this.resultData = SAMPLE;
}

上述硬编码的静态数据与输入控件绑定，但使用 Http 服务检索的动态数据存在问题在 http 服务调用之后，我尝试写入 console.log，我可以在浏览器控制台中看到内容。但它没有与输入控件绑定我正在使用 TemplateUrl 来引用 html 文件。要绑定的 HTML 标记

<input type="text" name="txtQueueID" class="form-control" id="txtQueueID" [(ngModel)]="resultData.queueId" />

使用服务获取数据的代码

 GetExtractorQueuesByID(_extractorQueueID) {
        console.log("Inside GetExtractorQueuesByID method in ExtractorQueueDetails");
        this._CacheDataService.GetExtractorQueuesByID(_extractorQueueID)
            .subscribe(
            (res) => {
                this.resultData = res;

            },
            (error) => console.log("error : " + error),
            () => console.log('Error in GetExtractorQueuesByID in ExtractorQueueDetails : ' + Error)
            );
    }

我的服务发出 http 请求

public GetExtractorQueuesByID = (queudID): Observable<ExtractorQueueItem> => {
    console.log("Inside method GetExtractorQueuesByID");

    var headers = new Headers();
    headers.append('Content-Type', 'application/json');
    headers.append('Access-Control-Allow-Origin', '*');
    console.log("API URL: " + this.BLUESKYDATACACHEAPI_GETEXTRACTORQUEUEBYID + queudID);

    return this._http.get(this.BLUESKYDATACACHEAPI_GETEXTRACTORQUEUEBYID + queudID, { headers: headers })
        .map(Response => Response.json())
        .catch(this.HandleError);
}

我的猜测是视图没有被绑定的最新 json 数据刷新。如何确保我刷新视图或重新绑定视图？有什么想法吗？

【问题讨论】：

你能把获取数据的代码贴出来吗？
queueId 不存在于您的 json 对象中。那么你是如何在输入中得到它的呢？
它可用，早期的图像未显示整个属性。参考最新图片

标签： angular angular2-directives

【解决方案1】：

queueId 属性在检索到的 json 对象中不可用。因此，您需要将其更改为对象的可用属性之一。

例如

[(ngModel)]="resultData.customerId"

【讨论】：