2016-03-07 8 views
3

Я делаю * ngДля эффективной работы с Ionic 2, но я бы хотел использовать collection-repeat, потому что он более приспособлен к широкому спектру данных.Ionic 2 & collection-repeat

Я загрузки данных в construtor:

import {Page, NavController, NavParams} from 'ionic-angular'; 
import {ListData} from './list-data'; 

@Page({ 
    templateUrl: 'build/pages/list-browser/list-browser.html', 
    providers: [ListData] 
}) 
export class ListBrowserPage { 
    static get parameters() { 
     return [[NavController], [NavParams], [ListData]]; // ]; 
    } 

    constructor(nav, navParams, listData){ 
     this.nav = nav; 

     this.items = listData.getItems(); 
     // listData.getItems() returns a 10 000 rows JSON : 
     // [{ 
     //  name: 'Al Aporte', address: '201 Thunder Wagon Common, Cataract, RI, 02987-1016, US, (401) 747-0763', 
     //  name: 'Jack Adit', address: '5198 Silent Parade, Round Bottom, MD, 21542-9798, US, (301) 060-7245', 
     //  ... 
     // }] 
    } 
} 

Вот мое мнение с * ngFor, там мой впрыскивается данные работает нормально:

<ion-list> 
    <ion-item *ngFor="#item of items"> 
    {{ item.name }} 
    </ion-item> 
</ion-list> 

Но одни и те же данные загружены сбор-повтор не работает:

<ion-list> 
    <ion-item collection-repeat="item in items"> 
     {{ item?.name }} 
    </ion-item> 
</ion-list> 

Данные отсутствуют и никаких ошибок. Я знаю, что это много данных и что я могу разделить JSON на стороне сервера, но этот случай предназначен для целей бенчмаркинга (Ionic 1 & collection-repeat намного лучше, чем Ionic 2 & ngFor).

Включает ли Ionic 2 бета эту директиву?

Спасибо,

Dédé

ответ

6

В Ionic 2 коллекция-повтор переименовывается в Virtual Scroll.

Таким образом, ваши Ионные 1 коды в ионическом 2 будут выглядеть следующим образом:

<ion-list [virtualScroll]="items"> 
    <ion-item *virtualItem="#item">{{item.name}}</ion-item> 
</ion-list> 

Вы можете прочитать Официальные документы на http://ionicframework.com/docs/v2/api/components/virtual-scroll/VirtualScroll/

И пример Джоша Morony на http://www.joshmorony.com/boosting-scroll-performance-in-ionic-2/

0

http://ionicframework.com/docs/v2/components/#lists

Я не думаю, что Ионные 2 бета включить эту директиву. Это не в доке.

Кстати,

бенчмаркнг нг-за не имеет большого смысла. В любом случае, он медленный. Мы все знаем, что реагировать на родной язык намного быстрее. : P

+0

Реагировать родные кажется довольно интересно. Я, конечно же, спрошу у команды Ionic, если они планируют интегрировать Collection-repeat в Ionic 2. –

0

В настоящее время ionic2 не использует сбор-повтор. ионный2. Есть infinite scroll и virtual scroll.

следует также отметить, что:

Новый угловой синтаксис позволит Угловая работать с родной веб компоненты и получить выгоды от использования веб-компонентов. Angular 2 принесет много интересных улучшений по сравнению с угловым 1 и скоро позволит нам создавать еще более масштабируемые веб-приложения. - Cory Rylan