nao*_*oru 2 twitter-bootstrap angularjs ionic-framework
我正在做一个离子混合应用程序,我有一个模态的问题
当我调用modal.show()方法时,我看到blackdropdown但不是实际的模态内容(我从文档中复制粘贴示例).检查铬中的模态对象我看到它很好地实现了.
我认为它与我的项目设置有关,所以生病了
index.html(占位符)
<body ng-app="myApp">
<ion-pane>
<ion-nav-view animation="slide-left-right"></ion-nav-view>
</ion-pane>
</body>
包含按钮以调用模态的页面
<ion-view class="backGround-clouds">
<ion-header-bar class="transparent" ng-controller="MenuController" align-title="center" style="margin-top:10px;">
<div class="buttons" style="margin-top:20px;">
<button class="button header-right-decor" ng-click="returnToLastView()"><i class="ion-person" style="font-size:2em;"></i></button>
<h1 class="title" style="height:65px;"><img src="img/new/logo.png"/></h1>
</div>
</ion-header-bar>
<ion-content style="margin-top:75px;">
<div id="errors" class="center" style="color:red;text-align:center;">
<ul>
<li ng-repeat="error in errors">{{error}}</li>
</ul>
</div>
<div class="center login-title">Transactions List</div>
<div class="row">
<div class="col">Date</div>
<div class="col">Transaction</div>
<div class="col">Amount</div>
<div class="col"></div>
</div>
<div class="row" style="margin:0px;" ng-repeat="transaction in transactions">
<div class="col">{{transaction.Date | date:"MM/dd/yy"}}</div>
<div class="col">{{transaction.ProPayID}}</div>
<div class="col">${{transaction.Amount}}</div>
<div class="col"><button class="button-transaction" ng-click="openTransactionDetail(1)">Detail</button></div>
</div>
</ion-content>
</ion-view>
最后我的简单modal.html
<div class="modal">
<header class="bar bar-header bar-positive">
<h1 class="title">Sample Modal</h1>
</header>
<ion-content has-header="true" padding="true">
<p ng-repeat="data in boulderDataChanges">{{data}}</p>
<button class="button" ng-click="fakeLogin()">Fake Login</button>
</ion-content>
</div>
如前所述,控制器正确调用它,但视图只显示没有模态标记的黑色窗帘
事实证明问题是我的项目中有一个bootstrap css并且它杀死了离子模态css
当我从索引中删除这一行
<link href="css/bootstrap.min.css" rel="stylesheet">
它就像一个魅力
顺便说一句我使用这个CSS是因为我使用角度日期选择器小部件
| 归档时间： |
|
| 查看次数： |
2570 次 |
| 最近记录： |