微调警报离子 [英] Spinner alert Ionic

问题描述

我希望在subTitle中显示一个带微调器的提示，如：

我尝试了，没有成功：

  this.alertCtrl.create（{
 title： 'Verificando'，
 subTitle：'< ion-spinner name =dots>< / ion-spinner> foo bar'
}）; 
  

任何想法？

解决方案

不幸的是，Ionic 2的AlertController默认情况下不提供在标题/副标题属性中嵌入HTML代码的方法。只有在装载东西时才会使用此警报吗？
在这种情况下，我建议您使用LoadingController组件，使用LoadingController可以插入html嵌入代码作为内容属性。

例如，在此我在类 .sp .sp-slices 上创建了一个自定义CSS动画，我正在插入名为loadingCtrl的LoadingController变量：

  this.loading = this.loadingCtrl.create（{
 spinner：'hide'，
 content：'< div class =sp sp-slices>< / div>'
}）; 
 this.loading.present（）; 
  

使用它应该给你足够的灵活性来调整LoadingController组件，使其看起来与你需要的完全一样。 / p>

Ionic 2还提供其他LoadingController设计，更接近Android iOS和Windows Phone的原生默认外观。值得一看的是他们的API文档：
https：// ionicframework .com / docs / api / components / loading / LoadingController /

I want show an alert with a spinner in subTitle like:

I tryed, without success:

this.alertCtrl.create({
   title: 'Verificando',
   subTitle: '<ion-spinner name="dots"></ion-spinner> foo bar'
});

Any ideas ?

解决方案

Unfortunately AlertController from Ionic 2 doesn't offer a way by default to embed HTML code inside the title/subtitle attribute. Will this alert be used only when you are loading something? On that case I suggest that you use the LoadingController component, with LoadingController it's possible to insert html embedded code as the content attribute.

For instance, on this case I have created a custom CSS animation on class .sp .sp-slices that I'm inserting on the LoadingController variable named loadingCtrl:

this.loading = this.loadingCtrl.create({
            spinner: 'hide',
            content: '<div class="sp sp-slices"></div>'
          });
this.loading.present();

Using this should give you flexibility enough to adjust the LoadingController component to look exactly like what you need.

Ionic 2 also offers other LoadingController designs that are much closer to the native default look for Android iOS and Windows Phone. It's worthy taking a look at their API documentation: https://ionicframework.com/docs/api/components/loading/LoadingController/

这篇关于微调警报离子的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！