Javascript 如何在typescript上定义自定义属性并将其用于匿名对象？

我在Angular组件中创建了自己的自定义getDate（）方法

getDate(date: Date){
    return date.format("dd-MMMM-yyyy HH:mm").toString();
}

我正在从数据库获取字符串JSON数据。这个JSON是这样的

`

`

我的getList方法看起来像

    getList(patientId?: number, pageNo?: number) {
       const auditTrailSubscription = 
         this._auditTrailService.getAuditTrailUrl(patientId, pageNo, 
         GridConfig.ITEMS_PER_PAGE)
          .subscribe(
            result => {
            try {
              this.results = [];
              this.totalItems = result.recordsCount;
              this.auditTrailList = result.lstRecords;
              this.auditTrailList.forEach(x => {
              let jschanges = JSON.parse(`[${x.jsonChanges}]`);
              jschanges.forEach(z => {
                this.results.push({
                  userName: x.userName,
                  timestamp: x.timestamp,
                  entityName: x.entityName,
                  field: z.field,
                  oldValue: z.oldValue instanceof Date ? 
                        this.getDate(z.oldValue) : z.oldValue,
                  newValue: z.newValue instanceof Date ? 
                     this.getDate(z.newValue) : z.newValue
                });
              });
            });
          } catch (e) {
            console.log(e);
          }
        },
        err => {
          this.handleError(err);
        }
      );

    this.addSubscription("auditTrail", auditTrailSubscription);
  }

Html文件

    <tr *ngFor="let at of results | paginate: { itemsPerPage: 
         _ITEMS_PER_PAGE, currentPage: crtPage, totalItems: totalItems }"
        [attr.data-row-id]="at.userId">
        <td>{{ at.userName }}</td>
        <td>{{ at.timestamp ? (at.timestamp | date: 
        AUDIT_TRAIL_DATE_TIME_FORMAT  ) :  'Unknown' }}</td>
        <td>{{ at.entityName }}</td>
        <td>{{ at.field | titlecase  }}</td>
        <td>{{ at.oldValue }}</td>
        <td>{{ at.newValue }}</td>
      </tr>

{{at.userName}
{{at.timestamp？（at.timestamp |日期：
审核\u跟踪\u日期\u时间\u格式）：“未知”}
{{at.entityName}
{{at.field | titlecase}}
{{at.oldValue}}
{{at.newValue}}

因此，我需要使用我的自定义getDate（）方法，检查oldValue和newValue是否为日期类型，然后使用getDate（）自定义方法，否则只返回其他值。

使用

Date.parse（）

。将日期字符串传递到

date.parse（）

中，如果它返回一个数字，则日期字符串是有效的日期。大概是这样的：-

if(isNaN(Date.parse("Tue Mar 26 00:00:00 GMT 2019"))){
     console.log("Invalid Date");
}
else {
    console.log("Valid Date")
}

或

var isDateValue =  (new Date(date) !== "Invalid Date") && !isNaN(new Date(date));

让我知道它是否适合您。

使用

Date.parse（）

。将日期字符串传递到

date.parse（）

中，如果它返回一个数字，则日期字符串是有效的日期。大概是这样的：-

if(isNaN(Date.parse("Tue Mar 26 00:00:00 GMT 2019"))){
     console.log("Invalid Date");
}
else {
    console.log("Valid Date")
}

或

var isDateValue =  (new Date(date) !== "Invalid Date") && !isNaN(new Date(date));

---

让我知道它是否适用于您。

如果您的AuditTrailService使用Angular的HttpClient，那么您可以为JSON HTTP响应提供接口。 可能是这样的：

interface AuditTrailResponse {
    recordsCount: number;
    lstRecords: AuditTrailRecord[];
}

在AuditTrailService中使用以下符号：

this.httpClient.get（'the/url/of/your/endpoint'，{your:params}）

这样，

result

将成为

AuditTrailResponse

而不是

any

我不完全理解将插入字符串解析为JSON和AFAIK

JSON的那一行。parse（）

不会生成日期对象，因此您的

oldValue instanceof Date

检查下面的几行永远不会为真

但您可以提供以下接口：

interface JSChange {
    userName: string;
    timestamp: number;
    entityName: string;
    oldValue: string | Date;
    newValue: string | Date;
}

---

如果您确实确定

z

参数符合接口，请对此接口执行强制转换。

如果您的AuditTrailService使用Angular的HttpClient，则可以为JSON HTTP响应提供接口。 可能是这样的：

interface AuditTrailResponse {
    recordsCount: number;
    lstRecords: AuditTrailRecord[];
}

在AuditTrailService中使用以下符号：

this.httpClient.get（'the/url/of/your/endpoint'，{your:params}）

这样，

result

将成为

AuditTrailResponse

而不是

any

我不完全理解将插入字符串解析为JSON和AFAIK

JSON的那一行。parse（）

不会生成日期对象，因此您的

oldValue instanceof Date

检查下面的几行永远不会为真

但您可以提供以下接口：

interface JSChange {
    userName: string;
    timestamp: number;
    entityName: string;
    oldValue: string | Date;
    newValue: string | Date;
}

---

如果您确实确定

z

参数符合接口，请对此接口执行强制转换。我的getAuditTrail（）方法返回PaginatedResponse类，它是所有服务的帮助器类。lstRecords:数组，totalItems:编号。我只是发送http get请求并从数据库中获取数据。显示数据没有问题。我只需要检查oldValue和newValue是否为日期，并显示适当的自定义格式。对于timstamp，我在html中只使用了简单的日期管道。但jsonchanges属性是动态的，而不是静态的。更详细地说，如果用户更改了它自动保存到新表中的内容，我们有两个表。在我的例子中，jsonchanges只是后端的简单字符串。我的getAuditTrail（）方法返回PaginatedResponse类，它是所有服务的帮助器类。lstRecords:数组，totalItems:编号。我只是发送http get请求并从数据库中获取数据。显示数据没有问题。我只需要检查oldValue和newValue是否为日期，并显示适当的自定义格式。对于timstamp，我在html中只使用了简单的日期管道。但jsonchanges属性是动态的，而不是静态的。更详细的情况是，如果用户更改了某些内容，它会自动保存到新表中，我会得到数据。请查看下面我写的注释。在我的情况下，情况有所不同。我还尝试了Date.parse。它不起作用。我不想检查日期是否有效。我只想如果是date，那么显示我的自定义日期格式，否则显示其他属性，这些值是动态的，我使用json.parse从json获取这些值，因此它将转换为字符串旧值和新值。我只需要转换而不是有效性。你能在stackblitz中创建你的场景吗？请看这个图片[link]，我想显示我的数据，比如修改的日期列，但正如你在新旧值中看到的，日期字段返回伪字符串。我需要在我的函数中修改它，为什么不在html中呢？因为这个值是动态的，我使用anonomyous属性获取数据。请看下面我写的评论。在我的情况下，情况有所不同。我还尝试了Date.parse。它不起作用。我不想检查日期是否有效。我只想如果是date，那么显示我的自定义日期格式，否则显示其他属性，这些值是动态的，我使用json.parse从json获取这些值，因此它将转换为字符串旧值和新值。我只需要转换而不是有效性。你能在stackblitz中创建你的场景吗？请看这个图片[link]，我想显示我的数据，比如修改的日期列，但正如你在新旧值中看到的，日期字段返回伪字符串。我需要在我的函数中改变它，为什么不在html中呢？因为这个值是动态的，我使用anonomyous属性获取数据。