Angular2 оператор elvis и нотация/привязка к кронштейну/доступ к объекту по ключу

Итак, скажем, у нас есть простой объект, который содержит строку для двух разных языков, например, welcomeText = {"de": "Willkommen zurück!", "en": "Welcome back!"}.

welcomeText является свойством объекта Texts, который содержит все тексты и получает асинхронно (поэтому мне нужно позаботиться о возможных значениях undefined, следовательно, о работе elvis). Теперь, в моем шаблоне angular2 я хочу показать текст на основе текущего выбранного языка.
Это работает (но не то, что мне нужно):

..
{{Texts?.welcomeText?.de}}   // works, as well as {{Texts?.welcomeText?.en}}
..

Что я хочу, так это (поскольку язык можно изменить):

..
{{Texts.?welcomeText?[language]}}
..

К сожалению, это приводит к ошибке:

EXCEPTION: Template parse errors:
Parser Error: Conditional expression 
      {{Texts?.welcomeText?[language]}}
     requires all 3 expressions at the end of the expression ..

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

..
{{getText('welcomeText')}} 
..
..
getText(name : string){
 if(this.Texts)
   return this.Texts[name][this.language]
..

Это просто путь, или есть способ сделать это так, как я хочу, с помощью оператора elvis?
Большое спасибо за любые ответы!

Ответы

Ответ 1

Я фактически закончил использование настраиваемого канала "надежной навигации", так как в моем случае цепочка нуль-чеков и квадратных скобок уходила в длину, а оператор Angular ?. не вписывался в ограничение [].

import { Pipe } from '@angular/core';
import { path } from 'ramda';

@Pipe({name: 'safe'})
export class SafeNavigationPipe {
    transform(propertyPath: any[], source: any) {
        return path(propertyPath, source);
    }
}

Где path function выполняет все задание - извлекает данные по указанному пути и возвращает undefined, как только путь не может быть разрешенным.

И может использоваться следующим образом:

{{ [userId, dayIdx, shiftIdx, 'status'] | safe:usersList  }}

Если элементы массива могут быть динамическими значениями.

Ответ 2

Я столкнулся с той же проблемой, и пока Элвис?. оператор был введен в этой теме: https://github.com/angular/angular/issues/791 теперь закрыт, @lgalfaso предложил расширить его, чтобы включить? [и? (

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

Ответ 3

Я думаю, что более простым решением для вашего случая было бы использование троичного оператора, например:

{{ Texts && Texts.welcomeText ? Texts.welcomeText[language] : '' }}

Вы можете проверить его путь к желаемому значению, и для этого не нужно вызывать функцию.

Ответ 4

Вы можете сделать что-то вроде:

{{(Texts.?welcomeText || {})[language]}}

так что в основном вы говорите "Get Me WelcomeText или пустой объект" - это всегда будет возвращать объект. Тогда вы можете получить любую недвижимость.

Ответ 5

У меня такое ощущение, что вы пытаетесь сделать здесь, на самом деле не существует, возможно, нет ничего о нем на странице синтаксис шаблона.

В чем его ценность, я не думаю, что что-то действительно не так с решением, которое вы придумали, вероятно, как бы я сам решил эту проблему.

Изменить: Также стоит отметить, что функции I18n и L10n Angular 2 еще не реализованы, я остался настроен для этой функции, чтобы решить проблему.