Question

我想知道是否有一个Angular2等效于Javascript中的括号表示法，它允许您使用变量来选择对象属性。或者做同样事情的方式。

请考虑以下代码：

 let selector = "foo";
 let someObject = {foo: "some content", guu: "some other content"};
 console.log(someObject[selector]); //bracket notation, logs "some content"

我在Angular2中尝试了以下内容：

  {{someObject[selector]}}
  {{someObject['selector']}}

都没有奏效。有没有其他方法可以在没有Javascript的情况下完成它？

Answer 1

这似乎在Angular中工作得很好：https://stackblitz.com/edit/angular-mrky5n。

某些原因导致它可能无法在您当前的应用程序中运行：

1）如果selector是一个带有字符串选择器的变量，那么selector变量可能不适用于模板的范围（例如，它是组件类的private ，在方法或生命周期钩子等中定义。

2）如果selector是您实际想要访问的属性，则selector的名称可能存在拼写错误 - 可能属性为selectro或{{1 }}。这是不使用此方法的原因，因为您丢失了Typescript的类型检查。 <{1}}在selecter完成时会发出错误。

3）该物业尚未收到价值 - 也许safe navigation operator会有所帮助。

Answer 2

Angular template syntax支持许多JS功能，包括括号表示法。

{{someObject[selector]}}表达式假定someObject和selector都是组件属性。如果它们是使用let定义的局部变量，则无效。

Angular2插值括号表示（而不是点）变量

2 个答案: