Javascript 打字脚本可以'；t访问JSON对象（Angular2）

我有一个最奇怪的问题

我正在接收一个JSON对象

{"login":"admin","name":"Admin"}

我在代码中所做的是：

private _userData: User;
...
private getUserData() {
    this._userInfoService.getUserInfo()
        .subscribe(
            data => {
                this._userData = data.json(); // (using <User> data.json() changes nothing
            },
            err => alert(err)
        );
}

但当我试图用angular访问html中的这些字段时：

<p>{{ _userData.login }}</p>
<p>{{ _userData.name }}</p>

和视图：

<p>{{ _login }}</p>
<p>{{ _name }}</p>

{{{u login}

{{{u name}}

然后一切都完美地工作了！我完全不知道发生了什么（尝试将data.json（）强制转换为，但没有任何改变。）

@编辑： 它工作的另一类是：

export interface LoginData {
    access_token: string;
    token_type: string;
    refresh_token: string;
    expires_in: number;
    scope: string;
}


private _loginData = <LoginData> JSON.parse(sessionStorage.getItem("loginData")); //tried this also with User, doesn't work

导出接口登录数据{
访问令牌：字符串；
令牌类型：字符串；
刷新令牌：字符串；
输入：数字；
经营范围：字符串；
}
private _loginda=JSON.parse（sessionStorage.getItem（“loginda”））//用户也尝试过了，但不起作用

并且认为：

<p>access_token: {{ _loginData.access_token }}</p>
<p>token_type: {{ _loginData.token_type }}</p>
<p>refresh_token: {{ _loginData.refresh_token }}</p>
<p>expires_in: {{ _loginData.expires_in }}</p>

访问令牌：{{{u loginda.access\u token}

令牌类型：{{{{u loginda.token}

刷新令牌：{{{u loginda.refresh\u令牌}

expires_in:{{{u loginda.expires_in}

用户数据以异步方式输入，这意味着它以前未定义。 此时angular将抛出异常，因为您执行了未定义的操作

您需要做的是，通过使用elvis运算符指示可能未定义userData

试试这个：

<p>{{ _userData?.login }}</p>
<p>{{ _userData?.name }}</p>

{{{u userData？.login}

{{{u userData？.name}

或者，您可以使用包装*ngIf

---

顺便说一句，这与typescript无关，但与angular2和javascript有关。请正确编辑您的标题

您试图建立到

\u userData的数据绑定。登录

而不是

\u userData

我看到两个可能的错误：

第一: -正如Patrick已经写到的，您的数据是异步到达的，这意味着

\u userData。当您尝试建立数据绑定时，login

是未定义的，因为

\u userData

是未定义的（并且没有默认的空值）。因此，数据绑定失败，并且在以后更新时不会通知您/获得任何更新 -您的第二个示例是有效的，因为

\u name

和

\u login

不是未定义的，而是填充了它们的

NULL

值（我猜是一个空字符串）。因此，数据绑定实际上已成功建立

第二： -第二个可能的错误是对象引用和对象属性的绑定。 -根据更改侦听器的实现方式，实际上是

obj1=newObject

和

obj1.attr1=newValue

之间的差异。因此，仅更改对象本身不会触发单个属性上的更改侦听器

---

无论如何，我敢打赌这是第一种可能性。您可以通过在构造函数中使用空对象初始化

User

对象来测试这一点

尝试在

标记前面添加类似的内容：

<div *ngFor="let uData of _userDat;">

然后

<p>{{uData.login}} 
</p></div>

{{uData.login}

或

{{{u userDat.login}

使用？进行安全导航

<p>{{ _userData?.login }}</p>

{{{u userData？.login}

这个

.json（）

函数来自哪里？我知道您尝试了

JSON.parse（）

，但仍然。。。

<p>{{uData.login}} 
</p></div>

<div *ngIf="user">
<p>{{_userDat.login}}</p>

<p>{{ _userData?.login }}</p>