如何动态显示占位符，包括带有角度条件的翻译

Question

我有一个动态表单，我试图在其中添加占位符和条件以及我想要包含翻译管道的条件。 但是下面的功能不起作用 这里我在占位符中有两个条件，一个是带星号的动态名称，另一个只是动态键，我需要根据下面的翻译按钮显示它是代码的链接

https://stackblitz.com/edit/angular-multilingual-translation-pimwhk?file=src%2Fapp%2Fapp.component.html

example: placeholder="{{field[i].is_mandatory
                  ? field[i].field_name_key +  ' *'
                  : field[i].field_name_key | translate}}


Html: 



    <form [formGroup]="form">
      <div class="mb-2">
        <small class="text-danger">*</small>
        <small class="pl-1">{{ "REQIREDFIELDS"  }}</small>
      </div>
      <div formArrayName="formData" *ngFor="let item of ordersFormArray.controls; let i = index">
        <ng-container [formGroupName]="i" [ngSwitch]="field[i].type">
          <div class="form-label-group mb-3 textPassword">
            <ng-container *ngSwitchCase="'inputText'">
              <input [type]="field[i].inputType == 'password' ? 'password' : 'text'" autocomplete="off" [formControlName]="field[i].field_name_key" class="form-control input-field" placeholder="
                        {{field[i].is_mandatory
                          ? field[i].field_name_key +  ' *'
                          : field[i].field_name_key | translate}}
                      " autofocus />

            </ng-container>
          </div>


        </ng-container>
      </div>

      <button type="button" [disabled]="!form.valid" class="btn btn-primary btn-block border-0">
            {{ "REGISTER"  }}
          </button>
    </form>

    <button type="button" class="btn btn-primary" (click)="useLanguage('ta')">  {{'login.button.en' | translate}}  </button>
    <button type="button" class="btn btn-primary" (click)="useLanguage('fr')">  {{'login.button.fr' | translate}}  </button>

如何在翻译中添加管道？ 请让我知道，因为我对此有任何解决方案

Answer 1

这是三元运算符和翻译管道的常见问题。您必须先评估您的条件（将其包装在 () 中），然后使用翻译管道。

placeholder="{{ (field[i].is_mandatory ? field[i].field_name_key_a : field[i].field_name_key_b) | translate}}"

当您有两个不同的键时，这应该可以工作。

编辑：现在我了解您要实现的目标，试试这个：

placeholder="{{ field[i].field_name_key | translate }}{{ field[i].is_mandatory ? " *" : ""}}"

所以你真正想做的是翻译field_name_key 并且只有当它强制附加“*”到它时。在您的方法中，您犯了一个错误，将其附加到翻译键中。所以翻译管道用于不存在的密钥："some.key.to.use *"