CODEWITHSUNDEEP
typescriptnativescript
physicist
physicist

Reputation: 55

Having a hard time using RadListView in NativeScript

This is my first time asking a question on StackOverflow, so I may sound weird. Please put up with me. So, I am writing a NativeScript program with TypeScript and Angular. I want to use RadListView in nativescript-telerik-ui, but it's not quite working.

This is what my app.component.ts looks like:

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 {}

And this is my 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() {}

}

And this is my 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>

I want to be able to manipulate RadListView in test.html using variable items in test.component.ts. However, whatever I do doesn't work at this moment. Can anyone show me how to do that in a working example?

Thanks a lot in advance.

Upvotes: 1

Views: 1147

Answers (1)

Saurabh.Chaudhari
Saurabh.Chaudhari

Reputation: 46

1) Syntax in .html file is different than xml file

2) nativescript-telerik-ui was before 2.0.0-rc.1 so they are currently working on it you can check this link https://github.com/telerik/nativescript-ui-samples-angular/issues/1#issuecomment-225791969

3)if you are using beta vesion of angular then check this link http://docs.telerik.com/devtools/nativescript-ui/Controls/Angular/getting-started

Upvotes: 1

Related Questions