RadListView 泰勒里克 UI "Cannot read property 'setLayoutParams' of undefined"
RadListView Telerik UI "Cannot read property 'setLayoutParams' of undefined"
在尝试使用 TelerikUI 中的 RadListView 时,我遇到了无法挂起的错误。根据angular个样本,我
在我的 submodule.ts 文件中导入了模块
import { NativeScriptUIListViewModule } from "nativescript-telerik-ui/listview/angular";
和
@NgModule({
imports: [
NativeScriptModule,
NativeScriptI18nModule,
NativeScriptRouterModule,
subRouting,
NativeScriptUIListViewModule,
],
declarations: [
ListPageComponent,
],
exports: [
]
})
export class SubModule {}
在 ListPageComponent 中创建了数据对象定义
class DataItem {
constructor(public id: string, public type: string) { }
}
并编写了我的组件 class
@Component({
selector: "list",
moduleId: module.id,
templateUrl: "list.page.html",
styleUrls: ["list.page.css"]
})
export class ListPageComponent implements OnInit {
public _dataItems: DataItem[] = [
{id: "1", type: "A"},
{id: "2", type: "A"},
{id: "3", type: "A"}
];
get dataItems(): ObservableArray<DataItem> {
return new ObservableArray(this._dataItems);
}
constructor(
private _pageRoute: PageRoute,
private _routerExtensions: RouterExtensions,
private _page: Page
){
}
ngOnInit(): void {
}
}
最后,尝试按照
的定义进行渲染
<GridLayout columns="*" rows="*">
<RadListView [items]="dataItems" col="0" row="1">
<ng-template tkListItemTemplate let-item="item">
<GridLayout columns="auto" rows="auto">
<Label class="descriptionLabel" [text]="item.type" col="0" row="0"></Label>
</GridLayout>
</ng-template>
</RadListView>
</GridLayout>
该示例适用于基本列表视图,但切换到 RadListView 会引发
An uncaught Exception occured on "main" thread. com.tns.NativeScriptException:
Calling js method onCreateViewHolder failed
Type Error: Cannot read property 'setLayoutParams' of undefined File: "file:///data/data/org.nativescript.myapp/files/app/tns_modules/nativescript-telerik-ui/listview/listview.js, line: 102 column: 42
StackTrace:
Frame: function:'ListViewAdapter.onCreateViewHolder', file"file:///data/data/org.nativescript.myapp/files/app/tns_modules/nativescript-telerik-ui/listview/listview.js, line: 102 column: 43
at com.tns.Runtime.callJSMethodNative (Native Method) [...]
在我的 android 模拟器上(还没有机会在 ios 上测试)
看来,我在使用 RadListView 时犯了一个基本错误,尽管我与 angular 应用程序的 nativescript-ui-samples 保持完全一致。
我的package.json摘录
"nativescript": {
"id": "org.nativescript.myapp",
"tns-android": {
"version": "3.1.1"
},
"tns-ios": {
"version": "3.1.0"
}
},
"dependencies": {
"@angular/animations": "~4.2.0",
"@angular/common": "~4.2.0",
"@angular/compiler": "~4.2.0",
"@angular/core": "~4.2.0",
"@angular/forms": "~4.2.0",
"@angular/http": "~4.2.0",
"@angular/platform-browser": "~4.2.0",
"@angular/router": "~4.2.0",
"moment": "^2.18.1",
"nativescript-angular": "~4.2.0",
"nativescript-gif": "^2.0.0",
"nativescript-i18n": "^0.2.2",
"nativescript-telerik-ui": "^3.1.0",
"nativescript-theme-core": "~1.0.4",
"reflect-metadata": "~0.1.8",
"rxjs": "~5.4.2",
"tns-core-modules": "~3.1.1",
"zone.js": "~0.8.2"
},
非常感谢任何提示。
谢谢。
您需要将所有内容更新到最新版本 tns plugin update
。还将 android 和 ios 版本更新为 3.2.0
在尝试使用 TelerikUI 中的 RadListView 时,我遇到了无法挂起的错误。根据angular个样本,我
在我的 submodule.ts 文件中导入了模块
import { NativeScriptUIListViewModule } from "nativescript-telerik-ui/listview/angular";
和
@NgModule({
imports: [
NativeScriptModule,
NativeScriptI18nModule,
NativeScriptRouterModule,
subRouting,
NativeScriptUIListViewModule,
],
declarations: [
ListPageComponent,
],
exports: [
]
})
export class SubModule {}
在 ListPageComponent 中创建了数据对象定义
class DataItem {
constructor(public id: string, public type: string) { }
}
并编写了我的组件 class
@Component({
selector: "list",
moduleId: module.id,
templateUrl: "list.page.html",
styleUrls: ["list.page.css"]
})
export class ListPageComponent implements OnInit {
public _dataItems: DataItem[] = [
{id: "1", type: "A"},
{id: "2", type: "A"},
{id: "3", type: "A"}
];
get dataItems(): ObservableArray<DataItem> {
return new ObservableArray(this._dataItems);
}
constructor(
private _pageRoute: PageRoute,
private _routerExtensions: RouterExtensions,
private _page: Page
){
}
ngOnInit(): void {
}
}
最后,尝试按照
的定义进行渲染<GridLayout columns="*" rows="*">
<RadListView [items]="dataItems" col="0" row="1">
<ng-template tkListItemTemplate let-item="item">
<GridLayout columns="auto" rows="auto">
<Label class="descriptionLabel" [text]="item.type" col="0" row="0"></Label>
</GridLayout>
</ng-template>
</RadListView>
</GridLayout>
该示例适用于基本列表视图,但切换到 RadListView 会引发
An uncaught Exception occured on "main" thread. com.tns.NativeScriptException:
Calling js method onCreateViewHolder failed
Type Error: Cannot read property 'setLayoutParams' of undefined File: "file:///data/data/org.nativescript.myapp/files/app/tns_modules/nativescript-telerik-ui/listview/listview.js, line: 102 column: 42
StackTrace:
Frame: function:'ListViewAdapter.onCreateViewHolder', file"file:///data/data/org.nativescript.myapp/files/app/tns_modules/nativescript-telerik-ui/listview/listview.js, line: 102 column: 43
at com.tns.Runtime.callJSMethodNative (Native Method) [...]
在我的 android 模拟器上(还没有机会在 ios 上测试)
看来,我在使用 RadListView 时犯了一个基本错误,尽管我与 angular 应用程序的 nativescript-ui-samples 保持完全一致。
我的package.json摘录
"nativescript": {
"id": "org.nativescript.myapp",
"tns-android": {
"version": "3.1.1"
},
"tns-ios": {
"version": "3.1.0"
}
},
"dependencies": {
"@angular/animations": "~4.2.0",
"@angular/common": "~4.2.0",
"@angular/compiler": "~4.2.0",
"@angular/core": "~4.2.0",
"@angular/forms": "~4.2.0",
"@angular/http": "~4.2.0",
"@angular/platform-browser": "~4.2.0",
"@angular/router": "~4.2.0",
"moment": "^2.18.1",
"nativescript-angular": "~4.2.0",
"nativescript-gif": "^2.0.0",
"nativescript-i18n": "^0.2.2",
"nativescript-telerik-ui": "^3.1.0",
"nativescript-theme-core": "~1.0.4",
"reflect-metadata": "~0.1.8",
"rxjs": "~5.4.2",
"tns-core-modules": "~3.1.1",
"zone.js": "~0.8.2"
},
非常感谢任何提示。
谢谢。
您需要将所有内容更新到最新版本 tns plugin update
。还将 android 和 ios 版本更新为 3.2.0