2016-04-25 9 views
0

Swiper-Angular2というコンポーネントをIONIC 2プロジェクトにインポートしていますが、言う:IONIC2 - SyntaxError:docs/file.js:ファイルの解析中に予期しないトークン(13:22):docs/file.js

SyntaxError: docs/file.js: Unexpected token (13:22) while parsing file: docs/file.js

はこれまでのところ、私のコードは次のとおりです。

page.js

import {Page} from 'ionic-angular'; 
import {Example1} from '../swiper/swiper'; 


@Page({ 
templateUrl: 'build/pages/home/home.html', 
directives: [Example1] 
}) 
export class HomePage {} 

page.html

<ion-content> 
<example1><example1> 
</ion-content> 

swiper.js

import {Component, ViewChild, AfterViewInit} from 'angular2/core'; 
import {KSSwiperContainer, KSSwiperSlide} from 'angular2-swiper'; 

@Component({ 
selector: 'example1', 
pipes: [], 
providers: [], 
directives: [KSSwiperContainer, KSSwiperSlide], 
template: require('./swiper.html') 
}) 
//The error triggers here, exactly after "Example1" 
export class Example1 implements AfterViewInit { 

@ViewChild(KSSwiperContainer) swiperContainer: KSSwiperContainer; 

example1SwipeOptions: any; 

constructor() { 
this.example1SwipeOptions = { 
    slidesPerView: 4, 
    loop: false, 
    spaceBetween: 5 
}; 
} 

moveNext() { 
this.swiperContainer.swiper.slideNext(); 
} 

movePrev() { 
this.swiperContainer.swiper.slidePrev(); 
} 

ngAfterViewInit() { 
console.log(this.swiperContainer); 
} 

} 

Swiper.html

<div class="myslides"> 
<ks-swiper-container [options]="example1SwipeOptions"> 
<ks-swiper-slide *ngFor="#s of [1,2,3,4,5,6,7]"> 
<img src="http://api.randomuser.me/portraits/thumb/men/{{s}}.jpg"> 
</ks-swiper-slide> 
</ks-swiper-container> 
<button (click)="movePrev()">Prev</button> 
<button (click)="moveNext()">Next</button> 
</div> 

問題を引き起こしているもの上の任意のアイデア?このうち

+0

あなたのIonic2プロジェクトにES6を使用していますか? –

+0

このファイルの内容は何ですか: 'docs/file.js'ですか?ありがとう! –

+1

ES6は既にそこにありますが、私はapp.jsでそれをはっきりと見ることができます file.js == swiper.js –

答えて

1

チェック:

https://forum.ionicframework.com/t/insert-swiper-slides-per-view-carousel-mode/50355

私はヨーヨーもSwiperをインポートする必要はありません信じています。ただし、すでにIONIC2に組み込まれているので、そのまま使用することができます。

+1

ありがとう、私はちょうどあなたが提供したリンクの手順に従って、私は私の問題を解決しました! –

関連する問題