Question

我已经从API请求数组，每页只显示20个数组。同时，总结果数千个。

这是我做过的服务。

   getNow() {

        let params: URLSearchParams = new URLSearchParams();
        let headers = new Headers();
        headers.append('Content-Type', 'application/vnd.api+json');
       headers.append('Accept', 'application/vnd.api+json');

       params.set("api_key","4285b6347f0429f60f6364ca644beab2");
        params.set("page", "1")

       let options = new RequestOptions({
         headers: headers,
         search: params
        });

        return this.http.get(this.API+"movie/now_playing", options)
         .map(
         (res: Response) => {
            return res.json()
        })   }

在home.ts我做了

 import { Component } from '@angular/core';  import { NavController }
 from 'ionic-angular';  import { ServiceProvider } from '../../providers/service/service';

 @Component({   
     selector: 'page-home',   
     templateUrl: 'home.html' })

 export class HomePage {

   public Now: any;

   constructor(
     public navCtrl: NavController,
     public service: ServiceProvider ) {

   }
      ionViewDidLoad() {   
 this.service.getNow().subscribe(

      HomePage =>{
        this.Now = HomePage.results;
        console.log(this.Now)
      }, (e)=>{
        console.log(e)
      }    )   }

 }

当我使用按钮从home.html的下一页加载更多数组时，我需要自动更改service.ts中params.set("page", "1" )的数字。那么我该如何实现呢？

Answer 1

考虑到您知道自动递增页码的逻辑。所以要在URL中传递参数，您需要接受服务中的参数，如

    getNow(page:string,
pageNumber:number) {

            let params: URLSearchParams = new URLSearchParams();
            let headers = new Headers();
            headers.append('Content-Type', 'application/vnd.api+json');
           headers.append('Accept', 'application/vnd.api+json');

           params.set("api_key","4285b6347f0429f60f6364ca644beab2");
            params.set(page, pageNumber)

           let options = new RequestOptions({
             headers: headers,
             search: params
            });

            return this.http.get(this.API+"movie/now_playing", options)
             .map(
             (res: Response) => {
                return res.json()
            })   }

并且在您的TS文件中，您应该传递自动递增的值或您的逻辑值，如

ionViewDidLoad() {   
 this.service.getNow(page,pageNumber).subscribe(

      HomePage =>{
        this.Now = HomePage.results;
        console.log(this.Now)
      }, (e)=>{
        console.log(e)
      }    )   }

变量页面和pageNumber应该在组件中声明，并在每次调用服务函数时传递。

如何在离子

1 个答案: