从角度 2 中的对象访问特定值

Posted

技术标签:

【中文标题】从角度 2 中的对象访问特定值【英文标题】:accessing specific values from Objects in angular 2 【发布时间】:2018-09-13 13:39:37 【问题描述】:

我的 Angular 2 项目中有一个函数

this.fetchedData=  this._visitService.getchartData().toPromise();
console.log("WORKING I HOPE0", this.fetchedData)` 

给出输出:

WORKING I HOPE0 
ZoneAwarePromise __zone_symbol__state: null, __zone_symbol__value: Array(0)
__zone_symbol__state:true
__zone_symbol__value:Array(2)
0:date: "2018, 03, 14", value: 11
1:date: "2018, 03, 15", value: 1
length:2
__proto__:Array(0)
__proto__:Object`

是否可以访问__zone_symbol__value 以将其作为一个对象整体获取,甚至只是从中检索数据。我尝试使用console.log("WORKING I HOPE0", this.fetchedData.__zone_symbol__value),但它似乎不起作用。我不是在寻找任何替代方法。所以如果我想知道它是否可能以及为什么或为什么不。

【问题讨论】:

【参考方案1】:

我认为你应该这样做:

this._visitService.getchartData().toPromise().then(data => 
    this.fetchedData = data;
    console.log(data);
)

对于您根据评论的查询,试试这个:

this._visitService.getchartData().toPromise().then(data => 
    this.fetchedData = data;
    console.log(data);
    this.processFetchedData(); // call the function once this.fetchedData is initialized
)

processFetchedData()
    console.log(this.fetchedData); // check the console

【讨论】:

好吧,我试过了,我知道它有效,但之后this.fetchData 仅在该特定函数内可用,但我希望能够在另一个函数内访问它。 不,当您将其分配给 this.fetchData 时,它也可以在函数之外使用, fetchData | json 将此行放在您的模板端,您就会明白,它只可用当它初始化时, 我不想要模板中的数据我想要代码中的数据。 @AtulStha ,您可以从那时调用第二个函数,这样第二个函数将在this.fetchedData 初始化后被调用【参考方案2】:

既然您想知道“为什么”方面:- 您必须首先等待承诺解决。在解析函数的成功处理程序中,您将获得数据。现在,“fetchedData”变量存储了 Promise,它只有 Promise 特定的功能,而“不是”实际数据。 解析后,如下所示,您可以检索数据并进行所需的解析。

有效的实际代码是上面@Vivek Doshi 给出的代码,使用'then'函数。

您可以按如下方式添加特定的成功/失败处理程序(如果您需要单独添加):-

var promise = serviceCall.toPromise();
promise.success( (data) => this.fetchedData = data );
promise.error( (err) => console.log(err.message) );

【讨论】:

【参考方案3】:

在将对象分配给它们之前先初始化您的对象。

this._visitService.getchartData().toPromise().then(data => 
    this.fetchedData = ; //initialize object
    this.fetchedData = data;
    console.log(data);
)

【讨论】:

【参考方案4】:

Promise 在异步操作完成或失败时处理单个事件。

它返回单个值。 不可取消。 它提供了带有 try/catch 和 async/await 的可读代码。

你应该等待承诺解决,所以这是你需要的:

this._visitService.getchartData().toPromise()
  .then(response => 
    this.fetchedData = response;
    console.log(response);
  )
  .catch(error =>  console.log(error) );

如果您的响应来自 http 调用:

this._visitService.getchartData().toPromise()
  .then(response => 
    var json = response.json();
    this.fetchedData = json;
    console.log(json);
  )
  .catch(error =>  console.log(error) );

【讨论】:

【参考方案5】:

我在重构代码以使用 async/await 时遇到了同样的问题,在这种情况下忘记在函数调用前加上 await。

添加例如

async MyFunction() 

    this.fetchedData = await this._visitService.getchartData().toPromise();


如果这是您的意图(在我的情况下是这样),可能会奏效。

【讨论】:

以上是关于从角度 2 中的对象访问特定值的主要内容,如果未能解决你的问题,请参考以下文章

如何从SQL中的列值中提取特定部分(Redshift平台)

从Array1中的特定行值中减去Array2中的行值

如何绑定角度组件中的任何特定对象属性

MySQL 从特定值中选择

vue:从数组内的对象访问特定数组

如何使用 Angular 访问 JSON 中的特定对象?