Question

我有一个使用ngModel显示数据的表单。如果我只是同步加载信息，它的效果很好但是当我尝试使用异步代码时，没有任何东西显示出来。我知道字段名称是正确的，因为正如我所说，它适用于同步代码。我确信这是我想念的傻事，但我无法弄清楚是什么。以下是一些代码snippits：

userinformation.service.ts

getuserinformation(): Promise<UserInformation> {
            return Promise.resolve(MOCKUSERINFORMATION[0]);
        }

userinformation.component.ts

getUserInformation(): void {
        this.userinformationservice.getuserinformation().then(userdata => this.userinfo = userdata);
    }

userinformation.component.html

<input type="text" autofocus="autofocus" name="FirstName" id="firstname" required="required" placeholder="First Name" class="required" ([ngModel])="userinfo.FirstName"  />

Answer 1

原来我使用的是错误类型的C＃MVC控制器。我使用的是基于＆＃34; Controller＆＃34;应该用于在代码中重定向用户的对象（因为我使用Angular时不需要）当我应该使用＆＃34; ApiController＆＃34;返回＆＃34; IHttpActionResult＆＃34;然后我可以使用＆＃34; .map（response =＆gt; response.json（））＆＃34;翻译对象。正确。

Answer 2

首先([...])无效。因为某种原因，它被命名为banana-in-a-box; - ）

应该是

[(ngModel)]="userinfo.FirstName"

在您的情况下，这仍然会导致错误，因为当userinfo为null时，userinfo.FirstName未定义。

这应该有效

[ngModel]="userinfo?.FirstName" (ngModelChange)="userinfo && userinfo.FirstName = $event"

或者

*ngIf="userinfo" [(ngModel)]="userinfo.FirstName"

这样<input>在userinfo尚未设置时就不会显示。

使用promises时ngModel不显示数据

2 个答案: