Как ion-slides работает на ionic 1.2.4 (или работает на 1.2.4?)

Я использовал документ http://ionicframework.com/docs/nightly/api/directive/ionSlides/ и в основном используют шаблон начального приложения. Я добавил html в шаблон и часть js в свой контроллер, но он выдал ошибку ReferenceError: fade не определено и ничего не показывает..

У кого-нибудь есть рабочий пример ion-slides для ionic 1.2.4? Я предполагаю, что они что-то изменили, но еще не подготовили для этого документ.

Вот код, который я использовал, я добавил часть 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)

Я использую пример ночной версии, и моя ионная версия 1.2.4.


ionic-framework javascript angularjs swiper
person JLL    schedule 24.01.2016    source источник
comment
опубликуйте свой код JS и HTML   -  person varun aaruru    schedule 25.01.2016
comment
Не уверен, почему за это проголосовали против, так как его код теперь включен. Я испытываю то же самое (скопировал код слайдера прямо из их документов). Я работаю над проектом, в котором использовалась Ionic версии 1.0.0, и я недавно обновился до 1.2.4, и я получаю именно эту ошибку.   -  person Will.Harris    schedule 28.01.2016

Ответы (4)


arrow_upward
8
arrow_downward

Что сработало для меня, так это установка параметра effect в строку, потому что то, что мы делаем (как написано и скопировано из их документов), передает ему переменную с именем fade и, конечно, мы не определили ее, что объясняет ошибку.

Поэтому измените свой код на

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

И это должно работать.

Вот список других эффектов, которые стоит попробовать :) slide или cube или coverflow

person Will.Harris    schedule 28.01.2016

arrow_upward
0
arrow_downward

Ознакомьтесь с ночной документацией: http://ionicframework.com/docs/nightly/api/directive/ionSlides/

person robenghuse    schedule 25.01.2016

arrow_upward
0
arrow_downward

Для лучшей документации ion-slides в v2 похож на v1:

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

person amrography    schedule 15.02.2017

arrow_upward
0
arrow_downward

Документация ion-slides создает ощущение, что она несколько неполна в ionic v1. Чтобы получить полную мощность нового компонента ионных слайдов, вам необходимо ознакомиться с документацией здесь< /а>

Если вы внимательно посмотрите на тег ion-slides, вы увидите что-то вроде этого slider="data.slider".

data.slider – это имя ползунка. Вы можете использовать это с методами, упомянутыми в приведенной выше ссылке, чтобы делать мощные вещи. Например, изменить индекс слайда или добавить кнопку для отображения следующего слайда.


Пример использования метода

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

person 2xSamurai    schedule 10.07.2017