key - angular2 elvis 运算符和括号表示法/按键访问对象

Question

所以，假设我们有一个简单的对象，它包含两种不同语言的字符串，例如
welcomeText = {"de": "Willkommen zurück!", "en": "欢迎回来!"。

welcomeText 是 Texts 对象的一个​​属性，它保存所有文本并异步传递(所以我需要处理可能的未定义值，因此需要处理 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 运算符？
非常感谢任何答案!

Answer 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  }}

其中数组项可以是动态值。