Question

我是nativescript / angular的新手，当用户滚动到列表底部时尝试加载更多项目，我尝试安装不同的npm插件但是应用程序无法构建并显示错误：

任务执行失败＆＃39;：mergeF0DebugResources＆＃39;。

/example/platforms/android/src/main/res/iOS/Info.plist：错误：不支持的类型＆＃39; dict＆＃39;

并且我尝试使用loadMoreItems（）事件它不起作用，加上这个加载的itemTap也无法正常工作。

    <GridLayout>
    <ListView [items]="convos" (loadMoreItems)="loadMoreItems()" class="small-spacing">
<ng-template let-item="item">
  <FlexboxLayout flexDirection="row">
    <Image  height="5" width="20%" stretch="aspectFill" loadMode="async" [src]='profilePic[item.to]'></Image>
    <StackLayout width="80%" (tap)="chatOpen(item.to)">
        <FlexboxLayout flexDirection="row">  
            <Label [text]="dispName[item.to]" class="medium-spacing" width="70%"></Label>
            <Label [text]="timeSince(item.createdAtTime)" class="medium-spacing pull-right" width="30%"></Label>
        </FlexboxLayout>
        <FlexboxLayout><Label [text]="item.message" class="medium-spacing" width="100%"></Label></FlexboxLayout>
    </StackLayout>
   </FlexboxLayout>
</ng-template>

TIA。

Answer 1

你不需要任何插件，因为列表视图支持这个 -

内置的loadMoreItemsEvent可用于在应用程序中实现无限滚动。无限滚动允许您按需加载内容而无需分页。

<强> HTML

<ListView [items]="myItems" (loadMoreItems)="loadMoreItems()">
<template let-item="item" let-i="index">
    <Label [text]="item"></Label>
</template>

<强> TS

import { Component } from '@angular/core';
import { EventData } from 'data/observable';`

@Component({
selector: 'list-test',
styleUrls: ['list-test.css'],
template: 'list-test.html'
})

export class ListTest {
public myItems: string[] = [];
public counter = 0;
constructor() {
    this.myItems = [];
    for (var i = 0; i < 50; i++) {
        this.myItems.push("data item " + i);
        this.counter = i;
    }
}

loadMoreItems() {
    // Load more items here.
    this.myItems.push("data item " + this.counter)
    this.counter += 1;
}}

链接 - https://docs.nativescript.org/angular/ui/list-view.html#load-more-items

Answer 2

    import { Component, OnInit } from "@angular/core";
    import { EventData } from 'data/observable';
    import { Router, ActivatedRoute, Params, Data } from '@angular/router';

我已经改变了我的进口订单，它开始运作了。不知道为什么，如果有人可以澄清我的话。

nativescript-angular：安装npm插件后无法构建

2 个答案: