我有一个 Angular 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;
这是开关盒:
handleCorrespondenceLoad(result) {
if (result.length === 0) {
this.message = this.emptyMessageCorrespondentie;
return;
}
this.allCorrespondence = result;
this.attachmentEntries = [];
this.correspondenceEntries = [];
for (let entry of result) {
switch (entry.type) {
case 'correspondence': {
this.correspondenceEntries.push(entry);
break;
}
case 'attachments': {
this.attachmentEntries.push(entry);
break;
}
default: {
break;
}
}
}
}
但是如何做到这一点呢？
谢谢
我这样试:
_.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"> </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"> </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"> </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"> </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"> </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"> </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"> </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"> </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"> </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"> </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"> </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"> </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"> </span></p></body>
↵</html>", …}length: 13__proto__: Array(0)
:4200/dossier-dossier-module-ngfactory.js:17352 Array(3)
这是 html:
<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>
但是现在如何在模板而不是 console.log 中显示它呢？谢谢
最佳答案
尝试:
const groups = groupBy(result, 'type')
console.log(groups.correspondence)
console.log(groups.attachments)
关于javascript - 如何将 LoDash GroupBY 与不同的数组类型一起使用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/57976589/