ion-slides 如何在 ionic 1.2.4 上工作（或者它在 1.2.4 上工作？）

Question

我使用了文档 http://ionicframework.com/docs/nightly/api/directive/ionSlides/ 并且基本上使用了入门应用程序模板。我将 html 添加到模板中，并将 js 部分添加到我的控制器中，但它给出了错误 ReferenceError: fade is not defined and shows nothing..

有人有 1.2.4 ionic 的工作离子幻灯片示例吗？我的假设是他们改变了一些东西，但还没有为它制作文档。

这是我使用的代码，我将 js 部分添加到控制器，将 html 添加到我的视图。

$scope.options = {
  loop: false,
  effect: fade,
  speed: 500,
}
$scope.data = {};
$scope.$watch('data.slider', function(nv, ov) {
  $scope.slider = $scope.data.slider;
})

<ion-slides  options="options" slider="data.slider">
  <ion-slide-page>
    <div class="box blue"><h1>BLUE</h1></div>
  </ion-slide-page>
  <ion-slide-page>
    <div class="box yellow"><h1>YELLOW</h1></div>
  </ion-slide-page>
  <ion-slide-page>
    <div class="box pink"><h1>PINK</h1></div>
  </ion-slide-page>
</ion-slides>

进入视图时收到此错误：

ReferenceError: fade is not defined
at new (controllers.js:22)
at invoke (ionic.bundle.js:17762)
at Object.instantiate (ionic.bundle.js:17770)
at ionic.bundle.js:22326
at self.appendViewElement (ionic.bundle.js:56883)
at Object.switcher.render (ionic.bundle.js:54995)
at Object.switcher.init (ionic.bundle.js:54915)
at self.render (ionic.bundle.js:56743)
at self.register (ionic.bundle.js:56701)
at updateView (ionic.bundle.js:62357)

我用的是nightly版本的例子，我的ionic版本是1.2.4

Answer 1

查看夜间文档： http://ionicframework.com/docs/nightly/api/directive/ionSlides/

Answer 2

对我有用的是将 effect 选项设置为一个字符串，因为我们正在做的（从他们的文档中编写和复制）正在向它传递一个名为 fade 的变量，当然我们还没有定义它来解释错误。

所以将您的代码更改为

$scope.options = {
        loop: false,
        effect: 'fade',
        speed: 500
    }

它应该可以工作。

这里还有其他要尝试的效果列表:) slide 或 cube 或 coverflow

Answer 3

为了更好的文档，v2 中的 ion-slides 类似于 v1：

https://ionicframework.com/docs/v2/api/components/slides/Slides/

Answer 4

ion-slides 文档给人一种感觉，它在 ionic v1 中有些不完整。要获得新 ion-slides 组件的完整功能，您需要查看 here

中的文档

如果您仔细查看 ion-slides 标签，您会看到类似这样的内容 slider="data.slider"。

data.slider 是滑块的名称。您可以将其与上述 link 中提到的方法一起使用，以实现强大的功能。比如更改幻灯片索引或添加按钮以显示下一张幻灯片。

示例方法用法

$scope.slider = data.slider;
$scope.slider.slideNext();

ion-slides 如何在 ionic 1.2.4 上工作（或者它在 1.2.4 上工作？）

How does ion-slides work on ionic 1.2.4 (Or does it work for 1.2.4?)

javascript

angularjs

ionic-framework

swiper