angular2-nativescript - RadListView 不显示项目
问题描述
我在我的应用程序中实现 RadListView 时遇到了很多困难。根据文档,ListView 接受项目作为 ObservableArray,但无论使用该数组还是普通数组,都不会显示项目。我在 Playground 中准备了一个示例应用程序
https://play.nativescript.org/?template=play-ng&id=39xE2X&v=11
组件是这样的:
import { Component, ViewChild, OnInit, ChangeDetectorRef, ElementRef } from "@angular/core";
import { GestureTypes, PanGestureEventData, TouchGestureEventData } from "tns-core-modules/ui/gestures";
import { ObservableArray } from "tns-core-modules/data/observable-array";
@Component({
selector: "ns-app",
moduleId: module.id,
templateUrl: "./app.component.html",
})
export class AppComponent implements OnInit {
public gridData = []; //new ObservableArray<any>();
constructor(
private cd: ChangeDetectorRef
) {
this.feedTestData();
}
ngOnInit() {
}
ngAfterViewInit() {
}
public detectChanges() {
this.cd.detectChanges();
}
private feedTestData() {
let data = [
{
description: 'line 1',
},
{
description: 'line 2',
},
];
this.gridData.splice(0, 0, data);
}
}
和这样的模板:
<GridLayout tkExampleTitle tkToggleNavButton>
<RadListView [items]="gridData">
<ng-template tkListItemTemplate let-item="item">
<StackLayout orientation="vertical">
<Label [text]="description"></Label>
</StackLayout>
</ng-template>
</RadListView>
</GridLayout>
更让我困惑的是,在我的真实应用程序中,RadListView 显示了一些东西,但它自己做,完全忽略了我的模板。我实际上可以在 RadListView 中留下任何内容,但它仍会显示项目
解决方案
我已经更新了你的游乐场,它现在正在工作。 https://play.nativescript.org/?template=play-ng&id=39xE2X&v=12
您试图访问 ng-template 中的描述,而它应该是 item.description
<Label [text]="item.description"></Label>
同样出于测试目的,我正在根据您的数据创建一个 Onservable 数组。this.gridData = new ObservableArray(data);
在您的 feedTestData 函数中。
推荐阅读
- fortran - 为什么不能在 ABAQUS 子程序中调用 MKL-FFTW3 库
- python - AttributeError:“系列”对象没有属性“iget”
- java - 配置数据源失败
- c# - C# windows服务识别按下了哪个功能键
- video - FFmpeg 压缩后的 HTML5 视频在浏览器中设置 currentTime 行为不同
- sql - 将多个分组查询组合成单个查询
- android - Android Studio 正在为 3 个月大的 react-native 项目生成非常旧的 apk
- python - Python Pandas dataFrame - 列选择
- wordpress - 如何使用 Wordpress 在主页上缩小滑块大小
- angular - Angular Observable 链接