File tree Expand file tree Collapse file tree 2 files changed +28
-3
lines changed Expand file tree Collapse file tree 2 files changed +28
-3
lines changed Original file line number Diff line number Diff line change 7
7
< ion-header >
8
8
9
9
< ion-navbar >
10
- < ion-title > Search</ ion-title >
10
+ < ion-title > Search : {{ searchQuery }} </ ion-title >
11
11
</ ion-navbar >
12
12
13
13
</ ion-header >
@@ -47,4 +47,7 @@ <h2> {{ product.title }} </h2>
47
47
</ button >
48
48
</ ion-item >
49
49
</ ion-list >
50
+ < ion-infinite-scroll (ionInfinite) ="loadMoreProducts($event) ">
51
+ < ion-infinite-scroll-content > </ ion-infinite-scroll-content >
52
+ </ ion-infinite-scroll >
50
53
</ ion-content >
Original file line number Diff line number Diff line change 1
1
import { Component } from '@angular/core' ;
2
- import { NavController , NavParams } from 'ionic-angular' ;
2
+ import { NavController , NavParams , ToastController } from 'ionic-angular' ;
3
3
import * as WC from 'woocommerce-api' ;
4
4
5
5
@Component ( {
@@ -11,8 +11,9 @@ export class SearchPage {
11
11
searchQuery : string = "" ;
12
12
WooCommerce : any ;
13
13
products : any [ ] = [ ] ;
14
+ page : number = 2 ;
14
15
15
- constructor ( public navCtrl : NavController , public navParams : NavParams ) {
16
+ constructor ( public navCtrl : NavController , public navParams : NavParams , public toastCtrl : ToastController ) {
16
17
console . log ( this . navParams . get ( "searchQuery" ) ) ;
17
18
this . searchQuery = this . navParams . get ( "searchQuery" ) ;
18
19
@@ -33,4 +34,25 @@ export class SearchPage {
33
34
console . log ( 'ionViewDidLoad SearchPage' ) ;
34
35
}
35
36
37
+ loadMoreProducts ( event ) {
38
+
39
+ this . WooCommerce . getAsync ( "products?filter[q]=" + this . searchQuery + "&page=" + this . page ) . then ( ( searchData ) => {
40
+ this . products = this . products . concat ( JSON . parse ( searchData . body ) . products ) ;
41
+
42
+ if ( JSON . parse ( searchData . body ) . products . length < 10 ) {
43
+ event . enable ( false ) ;
44
+
45
+ this . toastCtrl . create ( {
46
+ message : "No more products!" ,
47
+ duration : 5000
48
+ } ) . present ( ) ;
49
+
50
+ }
51
+
52
+ event . complete ( ) ;
53
+ this . page ++ ;
54
+
55
+ } ) ;
56
+ }
57
+
36
58
}
You can’t perform that action at this time.
0 commit comments