Переведенный параметр свойства в Angular5 - PullRequest
Новая
       7

Переведенный параметр свойства в Angular5

0 голосов
/ 05 декабря 2018

У меня есть primeNg multiselect (это чистый пример с сайта, ничего не добавлено).

на моем модуле я импортирую: 

import {MultiSelectModule} from 'primeng/multiselect';

, чем я создаюкомпонент с * .html как: 

<p-multiSelect [options]="cities1"
               [(ngModel)]="selectedCities1">
</p-multiSelect>

и * .ts: 

import {SelectItem} from 'primeng/api';

interface City {
    name: string,
    code: string
}

export class MyModel {
    cities1: SelectItem[];
    selectedCities1: City[];

    constructor() {
        this.cities1 = [
            {label:'New York', value:{id:1, name: 'New York', code: 'NY'}},
            {label:'Rome', value:{id:2, name: 'Rome', code: 'RM'}},
            {label:'London', value:{id:3, name: 'London', code: 'LDN'}},
            {label:'Istanbul', value:{id:4, name: 'Istanbul', code: 'IST'}},
            {label:'Paris', value:{id:5, name: 'Paris', code: 'PRS'}}
        ];
    }
}

Есть встроенные свойства, такие как [defaultLabel]="choose", которые являются строками. 

<p-multiSelect [options]="cities1"
               [(ngModel)]="selectedCities1"
               [defaultLabel]="choose"
</p-multiSelect>

Теперь я бы хотел изменить метку по умолчанию в зависимости от i18n:

Обычно в html я использую i18n как: 

<p>{{'MULTISELECT.DEFAULT' | translate }}</p>

Но он не будет работать как: 

<p-multiSelect [options]="cities1"
               [(ngModel)]="selectedCities1"
               [defaultLabel]="{{'MULTISELECT.DEFAULT' | translate }}"
</p-multiSelect>

Есть идеи, как передать значение перевода в параметр свойства?

1 Ответ

0 голосов
/ 19 декабря 2018

Для достижения этого мы можем использовать translateService: TranslateService.Импортировано import { TranslateService } from '@ngx-translate/core';

Мы можем использовать его как: 

this.translateService.get("MULTISELECT.DEFAULT").subscribe((translatedLabel: string) => {
      this.translatedMultiSelectDefaultLabel= translatedLabel;
    });

, а затем просто присвоить: 

<p-multiSelect [options]="cities1"
               [(ngModel)]="selectedCities1"
               [defaultLabel]="translatedMultiSelectDefaultLabel"
</p-multiSelect>
...