时间戳

首页 > 解决方案 > 在对象数组中查找 angular 6/typescript/javascript

javascript - 在对象数组中查找 angular 6/typescript/javascript

问题描述

我的 Angular 6 应用程序的 HTML 模板中有以下代码。

<div *ngIf ="conversation.participants[conversation.updatedBy.toLowerCase()].firstName">somedata </div>

基本上我试图通过 updatedBy 值在参与者数组的对象中搜索，看到它的匹配对象的 firstName 属性不为空，但它给了我未定义 firstName 的错误。

我还尝试在 ] 括号后放置问号，如下所示，但没有产生任何结果。

conversation.participants[conversation.updatedBy.toLowerCase()]?.firstName

下面是json对象

"participants": [{
        "dateJoin": 1520409578,
        "dateLeft": 0,
        "firstName": "edh",
        "internalId": 165,
        "invitedBy": "edh",
        "lastName": "edh",
        "userId": "edh"
    }, {
        "dateJoin": 1520409578,
        "dateLeft": 0,
        "firstName": "",
        "internalId": 166,
        "invitedBy": "edh",
        "lastName": "",
        "userId": "ATB"
    }],
    "dataInAB": "ATB",
    "subject": "test ",
    "unreadMessageCount": 0,
    "updateDate": 1520585258,
    "updatedBy": "atb"
}

如果您对此有所了解，请告诉我。

谢谢

标签： javascriptangulartypescript

解决方案

您需要在您的 component.ts 文件中声明一个变量，该变量将存储您使用的布尔结果*ngIf。并且在conversation变量更改时更新值。

例如，在component.ts

let firstNameExists = false;

getConversationData(){
  this.conversation = ....
  this.firstNameExists  = this.conversation.participants.find(m=>m.userId.toLowerCase()==this.conversation.updatedBy).firstName? true: false;
}

然后在你的component.html

<div *ngIf ="firstNameExists">somedata </div>

注意：在 ts 中使用了表达式，因为在角度绑定中使用表达式是一种非常糟糕的做法。

推荐阅读