Angular2/Nativescript：向列表视图中添加新项目时，前一个项目被覆盖

我正在尝试显示列表视图中的项目列表。我向ListView的模板中添加了一个GridLayout，然后向GridLayout的三列添加了项目名称，数量和删除（字体超棒的垃圾桶图标）。它似乎工作正常，但每当我添加一个新项目的视图列表中的前一个项目被最近覆盖。即该列表只包含一行，其中包含最近的项目，而不是在新的GridLayout中添加当前下方的最近项目。任何想法在这里可能会出错？我的代码如下Angular2/Nativescript：向列表视图中添加新项目时，前一个项目被覆盖

<ScrollView> 
    <StackLayout *ngIf="stockTakeDetailList.length > 0 && !product"> 
     <ListView [items]="stockTakeDetailList"> 
      <template let-captureItem="item" let-i="index"> 
       <GridLayout rows="*" columns="*, *, *"> 
        <Label row="0" col="0" class="list-group-item" textWrap="true" [text]="captureItem.ProductDetail_Name"></Label> 
        <Label row="0" col="1" class="list-group-item" [text]="captureItem.Qty"></Label> 
        <Label row="0" col="2" class="list-group-item font-awesome" text="&#xf1f8;" (tap)="removeCaptureItem(i)"></Label> 
       </GridLayout> 
      </template> 
     </ListView>   
    </StackLayout> 
</ScrollView> 

my component code for adding an item: 
submitCaptureItem(captureItem: CaptureItemModel) {  
    this.busy = true; 
    this.restService.postCaptureItem(captureItem) 
    .subscribe(
    (res) => { 
     this.busy = false; 
     if (res.ResponseCode !== 0) { 
      this.showError(res.CustomError); 
     } else { 
      this.stockTakeDetailList.unshift(res.StockTakeDetail);  
      this.product = null;   
     } 
    }, 
    (res) => {  
    this.busy = false; 
    this.showError("technical error"); 
     console.log(res); 
    }); 
    this.barcode = ''; 
    this.qty = ''; 
    }

来源

2017-05-03 user2094257

什么你添加更多的数据代码？你可以发布吗？ – mast3rd3mon

你也不需要围绕列表视图滚动查看 – mast3rd3mon

@ mast3rd3mon我刚刚添加了我的代码添加项目。谢谢参观。 – user2094257

你不需要有大约一个列表视图滚动型，列表视图本身已经内置了滚动视图使用此：

<StackLayout *ngIf="stockTakeDetailList.length > 0 && !product"> 
    <ListView [items]="stockTakeDetailList"> 
     <template let-captureItem="item" let-i="index"> 
      <GridLayout rows="*" columns="*, *, *"> 
       <Label row="0" col="0" class="list-group-item" textWrap="true" [text]="captureItem.ProductDetail_Name"></Label> 
       <Label row="0" col="1" class="list-group-item" [text]="captureItem.Qty"></Label> 
       <Label row="0" col="2" class="list-group-item font-awesome" text="&#xf1f8;" (tap)="removeCaptureItem(i)"></Label> 
      </GridLayout> 
     </template> 
    </ListView>   
</StackLayout>

来源

2017-05-03 12:10:59 mast3rd3mon

Angular2/Nativescript：向列表视图中添加新项目时，前一个项目被覆盖

回答

相关问题