Javascript 如何将LoDash GroupBY用于不同的数组类型_Javascript_Angular_Lodash

Javascript 如何将LoDash GroupBY用于不同的数组类型

javascript angular

Javascript 如何将LoDash GroupBY用于不同的数组类型,javascript,angular,lodash,Javascript,Angular,Lodash,我有一个角度8应用程序我想用lodash中的groupBy替换switch case语句我有这个： allCorrespondence: Array<DossierEntry>; correspondenceEntries: Array<DossierEntry>; attachmentEntries: Array<DossierEntry>; message = ''; emptyMessageCorrespondentie = 'Ge

我有一个角度8应用程序

我想用lodash中的groupBy替换switch case语句

我有这个：

 allCorrespondence: Array<DossierEntry>;
  correspondenceEntries: Array<DossierEntry>;
  attachmentEntries: Array<DossierEntry>;
  message = '';
  emptyMessageCorrespondentie = 'Geen correspondentie.';
  errorMessageConnection = 'Er ging iets mis met de connectie. Probeer over enkele minuten nogmaals.';

  correspondenceLoaded = false;
  showingSingle = false;

  single: DossierEntry;

但如何做到这一点呢

多谢各位

我试着这样做：

  _.mapValues(type, function(group, key) {
      return key === 'correspondence' ? _.groupBy(group, 'attachments') : group;

但是我会得到这个错误：

This condition will always return 'false' since the types 'number' and '"correspondence"' have no overlap.ts(2367)

谢谢。如果我这样做：

const groups = _.groupBy(result, 'type');
    console.log(groups.correspondence);
    console.log(groups.attachments);

然后我将看到结果：

Array(13)0: {dossierEntryId: 160, type: "correspondence", date: "2018-01-11T13:59:48.203125+01:00", name: "Hartrevalidatie intake", summary: "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans…ss="cs7294CA65">&nbsp;</span></p></body>
↵</html>", …}1: {dossierEntryId: 157, type: "correspondence", date: "2018-01-11T13:53:53.375+01:00", name: "Uitnodiging CV Courbet", summary: "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans…ss="cs7294CA65">&nbsp;</span></p></body>
↵</html>", …}2: {dossierEntryId: 154, type: "correspondence", date: "2018-01-10T10:51:40.09+01:00", name: "Eindbrief Dokkum", summary: "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans…ss="cs7294CA65">&nbsp;</span></p></body>
↵</html>", …}3: {dossierEntryId: 127, type: "correspondence", date: "2018-01-03T13:55:50.5335+01:00", name: "Oncologische revalidatie intake", summary: "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans…ss="cs7294CA65">&nbsp;</span></p></body>
↵</html>", …}4: {dossierEntryId: 124, type: "correspondence", date: "2018-01-03T13:06:37.221+01:00", name: "Oncologische revalidatie intake", summary: "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans…ss="cs7294CA65">&nbsp;</span></p></body>
↵</html>", …}5: {dossierEntryId: 107, type: "correspondence", date: "2017-12-11T14:18:29.920375+01:00", name: "Uitnodiging CV Courbet", summary: "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans…ss="cs7294CA65">&nbsp;</span></p></body>
↵</html>", …}6: {dossierEntryId: 106, type: "correspondence", date: "2017-12-11T13:54:42.795375+01:00", name: "Hartrevalidatie intake", summary: "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans…ss="cs7294CA65">&nbsp;</span></p></body>
↵</html>", …}7: {dossierEntryId: 105, type: "correspondence", date: "2017-12-11T13:52:53.732875+01:00", name: "Uitnodiging CV Courbet", summary: "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans…ss="cs7294CA65">&nbsp;</span></p></body>
↵</html>", …}8: {dossierEntryId: 104, type: "correspondence", date: "2017-12-11T13:52:53.232875+01:00", name: "Uitnodiging CV Courbet", summary: "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans…ss="cs7294CA65">&nbsp;</span></p></body>
↵</html>", …}9: {dossierEntryId: 103, type: "correspondence", date: "2017-12-11T12:24:19.27975+01:00", name: "Eindbrief Dokkum", summary: "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans…ss="cs7294CA65">&nbsp;</span></p></body>
↵</html>", …}10: {dossierEntryId: 102, type: "correspondence", date: "2017-12-11T12:24:17.59225+01:00", name: "Eindbrief Dokkum", summary: "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans…ss="cs7294CA65">&nbsp;</span></p></body>
↵</html>", …}11: {dossierEntryId: 38, type: "correspondence", date: "2017-12-10T14:11:51+01:00", name: "Oncologische revalidatie eindevaluatie", summary: "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans…ss="cs7294CA65">&nbsp;</span></p></body>
↵</html>", …}12: {dossierEntryId: 37, type: "correspondence", date: "2017-12-10T14:11:50+01:00", name: "Oncologische revalidatie eindevaluatie", summary: "<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans…ss="cs7294CA65">&nbsp;</span></p></body>
↵</html>", …}length: 13__proto__: Array(0)
:4200/dossier-dossier-module-ngfactory.js:17352 Array(3)

Array（13）0:{dossierEntryId:160，类型：“通信”，日期：“2018-01-11T13:59:48.203125+01:00”，名称：“Hartrevalidatie摄入”，摘要：
↵",…}2:{档案ID:154，类型：“通信”，日期：“2018-01-10T10:51:40.09+01:00”，名称：“Eindbrief Dokkum”，摘要：
↵“，…}4:{档案ID:124，类型：“通信”，日期：“2018-01-03T13:06:37.221+01:00”，名称：“肿瘤学再验证摄入”，摘要：
↵“，…}6:{档案ID:106，类型：“通信”，日期：“2017-12-11T13:54:42.795375+01:00”，名称：“Hartrevalidatie摄入”，摘要：
↵，…}8:{档案ID:104，键入：“通信”，日期：“2017-12-11T13:52:53.232875+01:00”，名称：“Uitnodiging CV Courbet”，摘要：
↵，…}10:{档案ID:102，类型：“通信”，日期：“2017-12-11T12:24:17.59225+01:00”，名称：“Eindbrief Dokkum”，摘要：
↵“，…}12:{档案ID:37，类型：“通信”，日期：“2017-12-10T14:11:50+01:00”，名称：“肿瘤学重新验证评估”，摘要：
阿尔杰明
资料
昂德韦尔普
{{entry.date}日期：“dd-MM-y”}
{{entry.name}
比吉拉奇
资料
昂德韦尔普
{{entry.date}日期：“dd-MM-y”}
{{entry.name}

但是现在如何在模板上而不是在console.log中显示它呢？谢谢您尝试：

const groups = groupBy(result, 'type')
console.log(groups.correspondence)
console.log(groups.attachments)

请参见

谢谢。但是我应该如何返回到页面？当然不应该返回到控制台。只需分配它们：

this.attachmentEntries=groups.correlations；this.attachmentEntries=groups.attachments；

但我的意思是在html模板中，因为现在不再有循环，模板不必更改，因为您正在使用g

groupBy

。你测试过吗？


<app-vital10-page [noTopBar]="true">
  <h2 class="dossier-page-header">Correspondentie</h2>

  <p class="data-entry" *ngIf="!allCorrespondence">{{ message }}</p>

  <app-is-loading *ngIf="!correspondenceLoaded" message="Correspondentie wordt geladen"></app-is-loading>

  <div *ngIf="!showingSingle && correspondenceEntries && correspondenceEntries.length > 0">
    <div class="main-row main-row-dossier">
      <section class="data-entry">
        <h3 class="dossier-header">Algemeen</h3>
        <table class="dossier-table">
          <thead class="dossier-tableheader">
            <tr>
              <th class="dossier-tablehead fixed-one-fifth">Datum</th>
              <th class="dossier-tablehead fixed-four-fifths">Onderwerp</th>
            </tr>
          </thead>
          <tbody class="dossier-tablebody">
            <tr class="dossier-correspondencerow" *ngFor="let entry of correspondenceEntries; let i = index" (click)="gotoItem(i, entry.type)">
              <td>{{ entry.date | date:"dd-MM-y" }}</td>
              <td>{{ entry.name }}</td>
            </tr>
          </tbody>
        </table>
      </section>
    </div>
  </div>

  <div *ngIf="!showingSingle && attachmentEntries && attachmentEntries.length > 0">
    <div class="main-row main-row-dossier">
      <section class="data-entry">
        <h3 class="dossier-header">Bijlage</h3>
        <table class="dossier-table">
          <thead class="dossier-tableheader">
          <tr>
            <th class="dossier-tablehead fixed-one-fifth">Datum</th>
            <th class="dossier-tablehead fixed-four-fifths">Onderwerp</th>
          </tr>
          </thead>
          <tbody class="dossier-tablebody">
          <tr class="dossier-correspondencerow" *ngFor="let entry of attachmentEntries; let i = index" (click)="gotoItem(i, entry.type)">
            <td>{{ entry.date | date:"dd-MM-y" }}</td>
            <td>{{ entry.name }}</td>
          </tr>
          </tbody>
        </table>
      </section>
    </div>
  </div>

  <app-dossier-correspondence-item
    [item]="single"
    (goBack)="goBack($event)"
    *ngIf="showingSingle">
  </app-dossier-correspondence-item>
</app-vital10-page>

const groups = groupBy(result, 'type')
console.log(groups.correspondence)
console.log(groups.attachments)