概述
Nativescript radListView不会在ios和android os上显示组件中的绑定项 .
操作栏和通常的ListView显示数据但radlistview不显示数据 . 控制台显示没有错误 . 但我看到下一个存储库中的RadListView可以工作 - > https://github.com/telerik/nativescript-ui-samples-angular
环境
我的开发环境如下 .
os:macOS sierra 10.12.6
node:v6.12.0
npm:3.10.10
在package.json之后可以看到nativescript和其他人
考虑
我觉得这个问题是关于这些......
但我无法改进 .
-
angular指令
-
初始化一个可观察数组
代码
在'tns create ui-test -ng'之后我在角度上实现了RadListView .
Component
export class ItemsComponent implements OnInit {
private _dataItems: ObservableArray<Item>;
constructor() {
}
get dataItems(): ObservableArray<Item> {
return this._dataItems;
}
ngOnInit() {
this._dataItems = new ObservableArray([
{ id: 1, name: "Ter Stegen", role: "Goalkeeper" },
{ id: 3, name: "Piqué", role: "Defender" },
{ id: 4, name: "I. Rakitic", role: "Midfielder" }
]);
}
}
html
<ActionBar title="My App" class="action-bar">
</ActionBar>
<GridLayout>
<RadListView [items]="dataItems">
<ng-template let-item="item">
<StackLayout>
<Label class="nameLabel" text="text"></Label>
<Label class="nameLabel" [text]="item.name"></Label>
<Label class="descriptionLabel" [text]="item.role"></Label>
</StackLayout>
</ng-template>
</RadListView>
</GridLayout>
package.json
{
"description": "NativeScript Application",
"license": "SEE LICENSE IN <your-license-filename>",
"readme": "NativeScript Application",
"repository": "<fill-your-repository-here>",
"nativescript": {
"id": "org.nativescript.uitest",
"tns-ios": {
"version": "3.3.0"
}
},
"dependencies": {
"@angular/common": "~5.0.0",
"@angular/compiler": "~5.0.0",
"@angular/core": "~5.0.0",
"@angular/forms": "~5.0.0",
"@angular/http": "~5.0.0",
"@angular/platform-browser": "~5.0.0",
"@angular/platform-browser-dynamic": "~5.0.0",
"@angular/router": "~5.0.0",
"nativescript-angular": "5.0.0",
"nativescript-fresco": "^3.0.2",
"nativescript-intl": "^3.0.0",
"nativescript-pro-ui": "3.3.0",
"nativescript-unit-test-runner": "^0.3.2",
"rxjs": "^5.5.2",
"tns-core-modules": "3.4.0",
"zone.js": "~0.8.2"
},
"devDependencies": {
"nativescript-dev-typescript": "~0.5.0",
"typescript": "~2.4.2"
}
}
3 回答
我确实得到你的代码并放入home.component在tns之后创建uitest -ng然后tns插件添加nativescript -ui-listview tns平台删除android tns平台添加android tns构建android tns运行android
如果您不忘记在home.module.ts中导入此模块,它可以工作:NativeScriptUIListViewModule
使用此item.model.ts
Important
在另一个项目中,直到我在app.module.ts中添加这些行时它才起作用
你试过
_dataItems
而不是dataItems
吗?看起来你已经定义了一个itemsource并在没有RadListView中的_
的情况下引用它 .我解决了自己 . RadListView需要一个getter和一个ObservableArray实现,并正确的html编码 . 我没有像row一样填充参数 .
但我不明白如何使用radListView . 现在我遇到了另一个GridLayout的radListView布局 .