Question

我有一个angular 4应用程序，我从一个带有springboot应用程序的数据库中获取数据。当我打开我的应用程序时，有一个get返回数据显示在第一页上。因此，我希望在数据加载时显示进度微调器，并在加载数据时删除微调器并显示数据。

所以，我不知道该怎么做。现在，这是我的html代码（数据显示在count = 0 for line in f: if count == 0: dict1 = parse_qs(line) count = count+1 else: dict2 = parse_qs(line) #combine dict1 with dict 2, and assign the new dict to dict1：

中

visTimeline

和ts代码：

 <md-spinner id="isLoadingSpinner" style="margin:0 auto;"></md-spinner>
 <visTimeline (myTask)="returnTask($event)" [tasks]="tasks"></visTimeline>

这就是datas.service中的get：

    ngOnInit() {
        this.tasks = this.datasService.getTasks();
        if(this.datasService.isLoading == false){
            document.getElementById("isLoadingSpinner").style.display = "none";
        }
    }

所以，我尝试在ngOnInit函数中使用if并且有一段时间但它不起作用。你知道我怎么做吗？

Answer 1

它不起作用的原因是因为ngOnInit（）方法是同步的，所以它在页面初始化时运行而不等待任何响应。

您可以使用[hidden]指令或* ngIf解决此问题，条件是来自＆＃34; datasService＆＃34;的布尔值。类。使用以下方式之一调整HTML代码：

 <md-spinner [hidden]="!datasService.isLoading" id="isLoadingSpinner" style="margin:0 auto;"></md-spinner>

或

<md-spinner *ngIf="datasService.isLoading" id="isLoadingSpinner" style="margin:0 auto;"></md-spinner>

使用其中一个实现，您不需要在ngOnInit（）中检查条件;

Answer 2

我在这里写了一篇文章，询问如何在Ionic中做一些事情，基于你在Angular here中做事的方式。它涵盖了您的需求。 路由器数据解析器

在angular4应用程序中加载数据时显示进度微调器

2 个答案: