【问题标题】:Having a hard time using RadListView in NativeScript在 NativeScript 中使用 RadListView 时遇到困难
【发布时间】:2016-06-15 15:10:33
【问题描述】:

这是我第一次在 StackOverflow 上提问,所以我可能听起来很奇怪。请忍受我。所以,我正在用 TypeScript 和 Angular 编写一个 NativeScript 程序。我想在 nativescript-telerik-ui 中使用 RadListView,但效果不太好。

这就是我的 app.component.ts 的样子:

import {Component} from "@angular/core";
import {RouteConfig} from "@angular/router-deprecated";
import {HTTP_PROVIDERS} from "@angular/http";
import {NS_ROUTER_DIRECTIVES, NS_ROUTER_PROVIDERS} from "nativescript-angular/router";

import {test} from "./pages/test.component";

@Component({
selector: "main",
    directives: [NS_ROUTER_DIRECTIVES],
    providers: [NS_ROUTER_PROVIDERS, HTTP_PROVIDERS],
    template: "<page-router-outlet></page-router-outlet>"
})
@RouteConfig([
    { path: "/test", component: test, name: "test", useAsDefault: true }
])
export class AppComponent {}

这是我的 test.component.ts

import {Component, ViewChild, ElementRef, OnInit} from "@angular/core";
import {Page} from "ui/page";

@Component({
    selector: "test",
    templateUrl: "pages/test.html",
    styleUrls: ["pages/test-common.css", "pages/test.css"],
    providers: []
})

export class test implements OnInit {

    constructor(private page: Page) {}

    ngOnInit() {}

}

这是我的test.html

<ActionBar title="RadListView"></ActionBar>

<lv:RadListView id="list-view" items="{{ items }}" xmlns='http://schemas.nativescript.org/tns.xsd' xmlns:lv='nativescript-telerik-ui/listview'>

    <lv:RadListView.listViewLayout>
        <lv:ListViewLinearLayout scrollDirection="Vertical"></lv:ListViewLinearLayout>
    </lv:RadListView.listViewLayout>

    <lv:RadListView.itemTemplate>
        <label text="{{ name }}"></label>
    </lv:RadListView.itemTemplate>

</lv:RadListView>

我希望能够使用 test.component.ts 中的变量 items 来操作 test.html 中的 RadListView强>。但是,此时我所做的任何事情都不起作用。谁能在一个工作示例中告诉我如何做到这一点?

非常感谢。

【问题讨论】:

  • 难道 xmlns 声明应该在父元素中才能使用 lv .. 谈论 xmlns:lv='nativescript-telerik-ui/listview' .. 也是绑定你的标签没有使用 nativescript-angular 语法,它应该是 [text]="name" (这同样适用于列表视图中的项目)检查本教程的 list-view with nativescript 和 aangular docs.nativescript.org/angular/tutorial/…
  • 尼克,非常感谢您的评论。我也想在父元素中声明 xmlns,但我不完全知道那是什么。会是 app.component 中的 "" 吗?另外,是否有用于 NativeScript 和 Angular 的 nativescript-telerik-ui 的教程或示例?我查看了本教程 (docs.telerik.com/devtools/nativescript-ui/Controls/NativeScript/…),但现在的情况令人困惑。
  • 刚刚在 GitHub (github.com/telerik/nativescript-ui-samples-angular) 上找到了这个存储库。对于和我有类似问题的人来说似乎非常有用。
  • 当您使用 NativeScript 核心(如您在链接中提供的示例)和带有 Angular 的 NativeScript(在我之前发布的链接中描述)时,语法存在差异。 .basicly 使用 Angular 时,您可以应用 Angular 语法进行绑定

标签: typescript nativescript


【解决方案1】:

1) .html 文件中的语法与 xml 文件不同

2) nativescript-telerik-ui 在 2.0.0-rc.1 之前,所以他们目前正在开发它,你可以查看这个链接 https://github.com/telerik/nativescript-ui-samples-angular/issues/1#issuecomment-225791969

3)如果您使用的是 angular 的 beta 版本,请查看此链接 http://docs.telerik.com/devtools/nativescript-ui/Controls/Angular/getting-started

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2017-05-20
    • 1970-01-01
    • 2011-07-25
    • 1970-01-01
    • 2012-10-31
    • 1970-01-01
    • 2019-03-03
    • 2013-10-18
    相关资源
    最近更新 更多