Как изменить уже привязанную «метку» на компоненте в Angular в зависимости от атрибутов элемента из цикла ngFor?

Question

Я нашел много статей о связывании, ngIf, ngFor и обо всем этом, но ничего не помогло в моей конкретной проблеме. Мне также кажется, что я пропускаю только некоторые синтаксические правила.

Следующая проблема: Если шаг внутри цикла ngFor повторяется, он должен добавить (1) к своему переведенному имени. Прямо сейчас он отображает весь «step.header |переводите как ярлык, а не то, что стоит за этим.

<div *ngFor="let step of dataService.current.steps" >
            <component 
            ...
            [label]="!step.repeated ? 'step.header | translate' : 'step.header | translate' + ' (1)'"
            ...
           </component>
</div>

Я надеюсь, что проблема вроде как ясна из этого.

Большое спасибо заранее!

Answer 1

Если вы хотите использовать канал как часть сложного выражения, вы должны заключить его в скобки. Вы также можете немного упростить выражение, так как основная часть одна и та же:

<div *ngFor="let step of dataService.current.steps">
    <component 
        [label]="(step.header | translate) + (step.repeated ? ' (1)' : '')">
    </component>
</div>