RadListView [object Object]

[angus]

Hi,

When copy/pasting the nativescript-ui-samples-angular/sdkAngular/app/listview/getting-started component into a brand new project {N} 3.2 using the tab template, I always get [object Object] displayed (screenshot : https://www.dropbox.com/s/gylu9zflttw51cd/Capture%20d%27%C3%A9cran%202017-09-13%2012.31.49.png?dl=0 )

If I fallback to ListView, it works like a charm...

When I run the nativescript-ui-samples-angular in my iOS emulator, it works too.

the only difference i was able to catch is the fact that nativescript-ui-samples-angular import the RadListView directive w/ the pro edition :

import { NativeScriptUIListViewModule } from "nativescript-telerik-ui-pro/listview/angular";

Whereas I installed the free edition and thus import  like that :

import { NativeScriptUIListViewModule } from "nativescript-telerik-ui/listview/angular";

Any idea?

Thanks in advance

[Nick Iliev]

Hello Angus,

The tab template is using lazily loaded modules. Make sure that you have imported the NativeScriptUIListViewModule in the respective module. For example, if you using the RadListView in the tabs component then you should import the module here.

Another thing, you should check out in your code base is the Angular binding syntax in your HTML file.

If this does not resolve your issue, please send us your sample project so we could investigate further.
You can delete node_modules and platforms folders and send us the archive here or via GitHub link.

Regards,
Nikolay Iliev
Progress Telerik

[angus]

Hello Nikolay,

Thank you so much. It was indeed the import, placed in app.module.ts, instead of tabs.module.ts that was the root cause.

I find odd that an import in app.module.ts (general import so to speak) is not available underneath (pages of tabs module), but I guess it's another angular thing ;-)

Thanks again. i'll now be able to dig into the UI 3.1 RadListView new features ;-)

 

[Nick Iliev]

Hi Angus,

I am glad to hear that the provided solution has resolved your issue and you can continue exploring the NativeScript UI controls! Let us know if you need any further assistance!

Regards,
Nikolay Iliev
Progress Telerik

[tonto]

I ran into the same issue and indeed your workaround solved mine. Thank you for that. It's still confusing to me, though. You say it's due to lazy loading (which I love BTW--you guys do great work!) but why does the "normal" ListView work without importing to the lower-level modules while RadListView requires that explicit import? Curious.

Thanks for your prompt responses on all these issues. Your team may be the best I've ever seen. Kudos to your commitment and dedication to excellence! Super impressed. If I'm ever in your area, I will look you up and buy your team a round. Outstanding!

[Nick Iliev]

Hi Angus,

Thank you for your kind words! If you happen to be nearby just let us know.

Regarding the explicit import for RadListView and ListView modules.

In fact, even if you are using the base ListView you will still need to explicitly import a specific module in the lazily loaded module.
The module is called NativeScriptCommonModule.  Without this import, the base ListView will also fail to "understand" the Angular binding and instead of
the expected values will return [object Object] or will throw a parse error. Real life example where this scenario is implemented can be seen here or in this POC application.

Regards,
Nikolay Iliev
Progress Telerik