首页 > 解决方案 > 打字稿响应选择数据

问题描述

HMy html 显示未定义(未定义),我可以在调试器中看到数据,所以我不确定我是否没有正确使用选择数据?HTML 视图

<div *ngIf="publishItemsWarningMessage" class="text-danger">
    {{publishItemsWarningMessage}}
    <ul>
        <li *ngFor="let detail of publishItemsWarningMessageDetails">
            {{detail}}
        </li>
    </ul>
</div>

打字稿

if (response.UnpublishedRelatedTemplates.length > 0) {
    this.publishItemsWarningMessageDetails = Enumerable
        .From(response.UnpublishedRelatedTemplates)
        .Select(UnpublishedRelatedTemplates => response.UnpublishedRelatedTemplates.RelatedTemplateId + " (" + response.UnpublishedRelatedTemplates.TemplateId + ")")
        .ToArray();
}

调试

在此处输入图像描述

UI显示未定义(未定义)

在此处输入图像描述

标签: javascriptangularasp.net-mvctypescript

解决方案


更新您的Typescript代码,如下所示。替换response.UnpublishedRelatedTemplatesUnpublishedRelatedTemplates内部.Select(...)

if (response.UnpublishedRelatedTemplates.length > 0) {
    this.publishItemsWarningMessageDetails = Enumerable
        .From(response.UnpublishedRelatedTemplates)
        .Select(UnpublishedRelatedTemplates => UnpublishedRelatedTemplates.RelatedTemplateId + " (" + UnpublishedRelatedTemplates.TemplateId + ")")
        .ToArray();
}

解释 你得到undefined是因为Select你在里面使用response.UnpublishedRelatedTemplates.RelatedTemplateId但是response.UnpublishedRelatedTemplates是一个array所以它不会有RelatedTemplateId。相反,您可以index [index]使用response.UnpublishedRelatedTemplates[index].RelatedTemplateId.

但是由于您已经Enumerating在您的数组中,因此UnpublishedRelatedTemplates将保持response.UnpublishedRelatedTemplates[index]. 所以你可以简单地更换它。

下面试试

let response = {
  UnpublishedRelatedTemplates: [{
    RelatedTemplateId: 'TMRelated2',
    TemplateId: 'TMRelated1'
  }, {
    RelatedTemplateId: 'TMDummy2',
    TemplateId: 'TMDummy1'
  }]
};

if (response.UnpublishedRelatedTemplates.length > 0) {
  let publishItemsWarningMessageDetails = Enumerable
    .From(response.UnpublishedRelatedTemplates)
    .Select(UnpublishedRelatedTemplates => UnpublishedRelatedTemplates.RelatedTemplateId + " (" + UnpublishedRelatedTemplates.TemplateId + ")")
    .ToArray();

  console.log(publishItemsWarningMessageDetails);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/linq.js/2.2.0.2/linq.min.js" integrity="sha256-dq1fzSor46Oc+U/DjuE2hKKN0FfvbVx+CW5GBn1mhiQ=" crossorigin="anonymous"></script>


推荐阅读