国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

angular.js - Pepijat dalam asynchronous ngfor rendering data dalam angular2?
僅有的幸福
僅有的幸福 2017-05-15 17:03:30
0
1
797

Saya menggunakan angular2 untuk membuat penomboran jadual

page.component.ts

    export class Interface {
    currentPage:Number;
    errorMessage:string;
    items:{};
    mode = 'Observable';
    shortPages:Promise<any>;
    private resolve:Function = null;

    constructor(private interfaceService:InterfaceService, params:RouteParams) {
        this.currentPage = parseInt(params.get('page'));
        this.shortPages = new Promise((resolve, reject) => {
            this.resolve = resolve;
        });
    }

    ngOnInit() {
        this.getDatas(this.currentPage);
    }

    getDatas(page) {
        /*this.interfaceService.getDatas()
         .subscribe(
         datas => this.items = datas,
         error =>  this.errorMessage = <any>error);*/
        this.items = this.interfaceService.getDatas(page)
            .subscribe(
                items => {
                    this.items = items;
                    if (items.page_total_cnts <= 7) {
                        let arr = [1,2,3,4,5];//測(cè)試用
                        for (let i = 2; i < items.page_total_cnts; i++) {
                            arr.push(i);
                        }
                        this.resolve(arr);
                        console.log(this.shortPages);
                    }
                    console.log(this.items)
                },
                error => this.errorMessage = <any>error);
    }
}

interface.service.ts

export class InterfaceService {
    constructor (private jsonp:Jsonp) {}
    private dataUrl = 'http://192.168.1.163:8009/testdata/read-server-api-testdata/';  // URL to web API
    getDatas (page): Observable<any> {
        let params = new URLSearchParams();
        params.set('page_idx', page); // the user's search value
        params.set('callback', 'JSONP_CALLBACK');
        return this.jsonp.get(this.dataUrl, { search: params })
                         .map(res => res.json());
        //return Datas
    }
    /*private extractData(res: Response) {
        let body = res.json();
        return body.data || { };
    }*/
    private handleError (error: any) {
        // In a real world app, we might use a remote logging infrastructure
        // We'd also dig deeper into the error to get a better message
        let errMsg = (error.message) ? error.message :
            error.status ? `${error.status} - ${error.statusText}` : 'Server error';
        console.error(errMsg); // log to console instead
        return Observable.throw(errMsg);
    }
} 

template.html

<a *ngFor="let number of shortPages|async"  [routerLink]="['Interface',{page: number}]" class="short">{{number}}</a>



Tetapi selepas saya menambah pertimbangan templat *ngIf pada templat:

<a *ngIf="true或者任何其他判斷條件" *ngFor="let number of shortPages|async"  [routerLink]="['Interface',{page: number}]" class="short">{{number}}</a>

Diberikan seperti ini, terdapat teg tambahan dengan kandungan kosong

Apa sebabnya?

僅有的幸福
僅有的幸福

membalas semua(1)
阿神

Lupakan, saya akan menjawabnya sendiri Setelah menyahpepijat untuk masa yang lama, nampaknya terdapat pepijat dalam NG2 apabila ng-if dan ng-for digunakan bersama pada elemen yang sama, jadi saya hanya boleh menambah satu. elemen templat di lapisan luar.

Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan