AngularJS - 显示弹出式卡片列表?

时间:2014-09-11 06:41:34

标签: angularjs popup ionic-framework

我正在使用Ionic框架来开发应用并拥有如下图所示的视图,并且当用户点击文本字段Account No:和{时,我希望显示一个弹出式卡片列表{1}},使用对Web服务的调用来填充卡列表。

我是Destination A/C:的新手,如果你能帮助我完成一个基本的例子,我将不胜感激。

http://i.stack.imgur.com/Oh4n6.png

fundtransfer.html

AngularJS

1 个答案:

答案 0 :(得分:0)

您可以使用Ionic模态组件,如果您不希望它是全屏,则覆盖CSS以调整大小。只需要一点CSS来调整模态窗口的大小,然后就可以将卡片组件放在模态中。

<强>标记

<ion-modal-view class="modal slide-in-up ng-enter active ng-enter-active">
  <ion-content>
    <div class="card">
    ...
    </div>
  </ion-content>
</ion-modal-view>

<强> CSS

.modal {
  width: 80%;
  top: 20%;
  left: 10%;
  min-height: 60%; 
  background: none;
}