Swiper + Ionic TypeError：无法读取null的属性'nodeType'

Question

如果我在两个不同的页面中向我的Ionic App添加了多个swiper-containers，则会出现此错误。

$rootScope.swiper = new Swiper('.swiper-container', {
   direction: 'horizontal',
   loop: true,
   effect: 'fade',
   autoplay: 4000
});

Answer 1

解决这个问题的方法是在每个swiper-container div中放置一个id，找到每个div的id，而不是类.swiper-container。 这样两个元素就不会混淆了。

    $scope.$on('$ionicView.afterEnter', function () {
      console.log("Loading Swiper");
      $rootScope.swiper = new Swiper(angular.element(document.querySelector("#homeSwiper")), {
        // Optional parameters
        direction: 'horizontal',
        loop: true,
        effect: 'fade',
        autoplay: 4000
      });

    });

    $scope.$on('$ionicView.beforeLeave', function () {
      console.log("Destory");
      $rootScope.swiper.destroy();
    });