Question

我正在使用Nativescript + Typescript / Angular2。

我有一个加载非常繁重的页面（它包含一个tabview和一个地图）所以我想在点击引用页面的routerlink时显示一个ActivityIndicator，并在加载页面时隐藏它。我想我可能会利用load类的Page事件（如前所述here）来实现它，但在文档中，它不清楚如何在Angular Nativescript中执行它。任何人都可以提供一个例子吗？

Answer 1

转到要显示ActivityIndicator的页面并在顶部添加：

<ActivityIndicator [busy]="isLoading" [visibility]="isLoading ? 'visible' : 'collapse'" row="1" horizontalAlignment="center" verticalAlignment="center"></ActivityIndicator>

您必须在此页面的组件中创建名为isLoading的新属性，并将其初始化为false：

isLoading = false;

现在您拥有此属性，最后一步是在加载数据时将此属性设置为true以显示加载器。这将根据您的实现而有所不同。但为了便于解释，我们可以认为您已经编写了一些处理数据的服务，我们正在我们的组件中订阅它。我将使用ngOnInit（）函数订阅此服务并显示activityIndicator，如下所示

ngOnInit() {
  this.isLoading = true; //setting isLoading to true in order to show the loader
  this.SomeService.load()
    .subscribe(res => {
      //do stuff with the data 
      //like iterate ,bind etc 
      this.isLoading = false; // setting the isLoading property back to false after doing req. stuff.
    });
}

就是这样。我希望这能帮到您。

Nativescript：在页面转换过程中显示ActivityIndicator

1 个答案:

Nativescript：在页面转换过程中显示ActivityIndi​​cator

1 个答案:

Nativescript：在页面转换过程中显示ActivityIndicator