数据从observable返回后，Angular View未更新

Question

在public void mouseOver(String loc) { Actions ToolTip1 = new Actions(driver); WebElement pr = findElement(loc); System.out.println(pr); pause(2000); ToolTip1.moveToElement(pr).perform(); pause(2000); String toolTipMsg = pr.getText(); pause(1000); System.out.println(toolTipMsg); } 应用程序中，在组件内部，我调用一个observable订阅，一旦收到数据，我就初始化一个要在模板中使用的对象。模板是一个简单的表格。

正确完成对后端API的调用和本地对象的初始化，因为我可以查看日志。但是，当数据可用时，视图不会自行刷新。

仅当我在模板上单击鼠标时，视图才能正确反映数据。

模板

AngularJS 1.6

控制器

<table class="table light-gray table-no-borders table-condensed">
 <tr>
    <td>
        <span>{{maCtrl.userDetails.lastname}}</span>
    </td>
    <td>
        <span>{{maCtrl.userDetails.firstname}}</span>
    </td>
  </tr>
 <tr>
    ....
 </tr>
</table>

组件

export class MADetailsController {

public uid: string;
public userDetails: MADetails;

constructor(private currentUserService: IUserService, private maService: MAService) { }

$onInit() {
    if (this.uid) {
        this.currentUserService.getCurrentUser()
            .subscribe(u => {
                this.maService.getPersonDetailsFromSnapshotByUId(this.uid)
                    .then((res: QueryResult<any>) => {

                        let employee = res.data;
                        this.userDetails = new MADetails();

                        this.userDetails.firstname = employee.firstname;
                        this.userDetails.lastname = employee.lastname;

                        //Further initialization...

                    })
            })
    }
  }
}

}