From 5971d09df8435e7f0f395065139e6011f3c0750a Mon Sep 17 00:00:00 2001
From: rhenck <richard.henck@iqb.hu-berlin.de>
Date: Fri, 14 Oct 2022 10:54:07 +0200
Subject: [PATCH] Fix function calls in template of cloze component
Create new pipe for checking if element is included in list.
---
.../compound-elements/cloze/cloze.component.ts | 10 +++++-----
projects/common/pipes/array-includes.pipe.ts | 10 ++++++++++
projects/common/shared.module.ts | 4 +++-
3 files changed, 18 insertions(+), 6 deletions(-)
create mode 100644 projects/common/pipes/array-includes.pipe.ts
diff --git a/projects/common/components/compound-elements/cloze/cloze.component.ts b/projects/common/components/compound-elements/cloze/cloze.component.ts
index 10bd922d0..146f5fef6 100644
--- a/projects/common/components/compound-elements/cloze/cloze.component.ts
+++ b/projects/common/components/compound-elements/cloze/cloze.component.ts
@@ -139,14 +139,14 @@ import { ClozeElement } from 'common/models/elements/compound-elements/cloze/clo
<ng-template #paragraphChildren let-part>
<ng-container *ngFor="let subPart of part.content">
<ng-container *ngIf="$any(subPart).type === 'text' &&
- (!(subPart.marks | markList).includes('superscript')) &&
- (!(subPart.marks | markList).includes('subscript'))">
+ (!(subPart.marks | markList | arrayIncludes:'superscript')) &&
+ (!(subPart.marks | markList | arrayIncludes:'subscript'))">
<span [ngStyle]="subPart.marks | styleMarks">{{subPart.text}}</span>
</ng-container>
- <ng-container *ngIf="$any(subPart).type === 'text' && (subPart.marks | markList).includes('superscript')">
+ <ng-container *ngIf="$any(subPart).type === 'text' && ((subPart.marks | markList) | arrayIncludes:'superscript')">
<sup [ngStyle]="subPart.marks | styleMarks">{{subPart.text}}</sup>
</ng-container>
- <ng-container *ngIf="$any(subPart).type === 'text' && (subPart.marks | markList).includes('subscript')">
+ <ng-container *ngIf="$any(subPart).type === 'text' && ((subPart.marks | markList) | arrayIncludes:'subscript')">
<sub [ngStyle]="subPart.marks | styleMarks">{{subPart.text}}</sub>
</ng-container>
<ng-container *ngIf="$any(subPart).type === 'image'">
@@ -155,7 +155,7 @@ import { ClozeElement } from 'common/models/elements/compound-elements/cloze/clo
[style.height]="'1em'"
[style.vertical-align]="'middle'">
</ng-container>
- <span *ngIf="['ToggleButton', 'DropList', 'TextField', 'Button'].includes(subPart.type)">
+ <span *ngIf="['ToggleButton', 'DropList', 'TextField', 'Button'] | arrayIncludes:subPart.type">
<aspect-compound-child-overlay [style.display]="'inline-block'"
[parentForm]="parentForm"
[element]="$any(subPart).attrs.model"
diff --git a/projects/common/pipes/array-includes.pipe.ts b/projects/common/pipes/array-includes.pipe.ts
new file mode 100644
index 000000000..3041ddc5d
--- /dev/null
+++ b/projects/common/pipes/array-includes.pipe.ts
@@ -0,0 +1,10 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+ name: 'arrayIncludes'
+})
+export class ArrayIncludesPipe implements PipeTransform {
+ transform(valueList: string[], searchValue: string): unknown {
+ return valueList.includes(searchValue);
+ }
+}
diff --git a/projects/common/shared.module.ts b/projects/common/shared.module.ts
index 102cb183d..0eafaec25 100644
--- a/projects/common/shared.module.ts
+++ b/projects/common/shared.module.ts
@@ -67,6 +67,7 @@ import { CompoundChildOverlayComponent } from './components/compound-elements/cl
import { MarkListPipe } from './pipes/mark-list.pipe';
import { IsDisabledDirective } from './directives/is-disabled.directive';
import { GeometryComponent } from './components/geometry/geometry.component';
+import { ArrayIncludesPipe } from './pipes/array-includes.pipe';
@NgModule({
imports: [
@@ -124,7 +125,8 @@ import { GeometryComponent } from './components/geometry/geometry.component';
CompoundChildOverlayComponent,
MarkListPipe,
IsDisabledDirective,
- GeometryComponent
+ GeometryComponent,
+ ArrayIncludesPipe
],
exports: [
CommonModule,
--
GitLab