第二次滑动后离子滑动盒不起作用

时间:2015-11-15 11:02:52

标签: angularjs ionic

我遇到了离子滑动盒的问题 当我放置2张幻灯片时,它工作正常,但是当我插入新幻灯片时,它隐藏了一些幻灯片

(id,id)

和控制器

head(df)
##                        id year value rank
## 13              Citigroup 2007   255    1
## 15                   HSBC 2007   215    2
## 14              JP Morgan 2007   165    3
## 2  Royal Bank of Scotland 2007   120    4
## 9                     UBS 2007   116    5
## 12              Santander 2007   116    6

df <- structure(list(id = c("Citigroup", "HSBC", "JP Morgan", "Royal Bank of Scotland", 
"UBS", "Santander", "BNP Paribas", "Goldman Sachs", "Unicredit", 
"Barclays", "Societe Generale", "Deutsche Bank", "Credit Suisse", 
"Credit Agricole", "Morgan Stanley", "HSBC", "JP Morgan", "Santander", 
"UBS", "Goldman Sachs", "BNP Paribas", "Credit Suisse", "Societe Generale", 
"Unicredit", "Citigroup", "Credit Agricole", "Morgan Stanley", 
"Deutsche Bank", "Barclays", "Royal Bank of Scotland"), year = structure(c(1L, 
1L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 1L, 2L, 2L, 
2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L, 2L), .Label = c("2007", 
"2009"), class = "factor"), value = c(255, 215, 165, 120, 116, 
116, 108, 100, 93, 91, 80, 76, 75, 67, 49, 97, 85, 64, 35, 35, 
32.5, 27, 26, 26, 19, 17, 16, 10.3, 7.4, 4.6), rank = c(1, 2, 
3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 1, 2, 3, 4, 5, 6, 
7, 8, 9, 10, 11, 12, 13, 14, 15)), .Names = c("id", "year", "value", 
"rank"), row.names = c(13L, 15L, 14L, 2L, 9L, 12L, 7L, 11L, 8L, 
6L, 5L, 3L, 10L, 4L, 1L, 30L, 29L, 27L, 24L, 26L, 22L, 25L, 20L, 
23L, 28L, 19L, 16L, 18L, 21L, 17L), class = "data.frame")
## Data Source: A lecture handout by professor Andrei Shleifer of Harvard university, with data source quoted as J.P. Morgan and dated February 2009.

这个

的解决方案

2 个答案:

答案 0 :(得分:0)

我解决了这个问题: - 我从左到右替换浮动,因为阿拉伯方向rtl; - 我在ionic.css中将其替换回左侧。

这意味着这是我的错误。

.slider-slide {
  position: relative;
  display: block;
  float: left;
  width: 100%;
  height: 100%;
  vertical-align: top; }

第5463行

答案 1 :(得分:0)

如果您更改了离子元素中的方向(rtl),则滑块无法正常工作。

将dir ='ltr'添加到ion-slides元素。

这是一个例子:

<ion-slides pager dir="ltr">
<ion-slide *ngFor="let slide of slides">
  <img [src]="slide.image" class="slide-image" />
  <h2 class="slide-title" [innerHTML]="slide.title"></h2>
</ion-slide>