如何在休息webservice响应来之后渲染angular2 html页面

Ton*_*kuk 3 rest typescript angular

我可以得到休息webservice响应并在屏幕上控制它没有任何问题.但不幸的是,在页面中我可以看到werbservice调用结果的初始值.在我收到wbservice的回复后,我需要做什么才能呈现页面?我的意思是我可以看到userInfo和userName的初始值.您可以在下方看到该代码段.

关心Alper

  export class NavigationComponent implements OnInit {
response:any;
errorMessage:any;
form:FormGroup;
obj = {"one": "", "two": "", "three": "", "four": ""};
webserviceUrl = "https://httpbin.org/post";
webServiceUrlGet = "https://jsonplaceholder.typicode.com/posts/1";
username = "alper"
userInfo = "alper Info";
componentName =  'AppComponent';

ngOnInit():void {
  this.getUserName();
}

 getUserName() {

this.http.get(this.webServiceUrlGet)
  .subscribe(
    function (data) {
      this.userInfo = data.json();
      this.username = this.userInfo.userId;


    },
    error => this.errorMessage = <any>error);
return this.username;
}
Run Code Online (Sandbox Code Playgroud)

Gün*_*uer 7

这不行

.subscribe(
  function (data)
Run Code Online (Sandbox Code Playgroud)

它应该是

.subscribe(
  (data) =>
Run Code Online (Sandbox Code Playgroud)

对于this回调里面工作.

要仅在响应到达时呈现模板,您可以使用

<ng-container *ngIf="userInfo">
  <!-- actual template content here -->
</ng-container>
Run Code Online (Sandbox Code Playgroud)