无法以http开头访问对象变量

Question

我有一个名为profile的JSON对象,我在我的应用程序中使用,我可以在我的html中访问如下:

<pre>{{ profile | json }}</pre>

这在我的屏幕上给出了以下结果(省略了值):

{
    "sub": "Test",
    "name": "Test",
    "nickname": "Test",
    "picture": "Test",
    "updated_at": "2017-07-05T03:34:49.038Z",
    "http://test.com/roles": [
        "admin",
        "guest"
    ]
}

我可以访问所有变量,如下所示:

<h3 class="name">{{ profile?.name }}</h3>

但是我遇到麻烦的是访问以http开头的变量.如果我尝试:

<h3 class="name">{{ profile?.http://test.com/roles }}</h3>

我得到意外的令牌错误.

我无法更改此变量的名称是否有其他方式我可以访问它.

谢谢,

Answer 1

与JavaScript类似,您需要对没有有效标识符名称的对象属性使用括号表示法:

<h3 class="name">{{ profile ? profile['http://test.com/roles'] : '' }}</h3>

不幸的是,括号表示法不支持安全导航操作符(?),因此您必须使用三元运算符.