CODEWITHSUNDEEP
androidlabelnativescript
Pamungkas Jayuda
Pamungkas Jayuda

Reputation: 1280

How to user Label Nativescript with text value number / date

i want to show number or date from bindingcontex array. with this code : 

<ListView items="{{ pakets }}" itemTap="onTap">
    <ListView.itemTemplate>
        <grid-layout rows="220, *, *, *" columns="*" id="cardReport" tap="goReport">
            <image row="0" src="{{ foto }}" stretch="aspectFill"/>
            <Label row="1" text="{{ textValue }}" />
            <Label row="2" text="{{ numberValue }}" />
            <Label row="3" text="{{ dateValue }}" />
        </grid-layout>
    </ListView.itemTemplate>
</ListView>

array pakets fron JSON with value textValue = 'XXXX', numberValue = 3000, dateValue = '2016-06-04'

Both of numberValue and dateValue not show, but textValue show to screen.

What the problems about it ? How to use namber or date in Label Nativescript.

Thanks anyway

Upvotes: 0

Views: 480

Answers (2)

Pamungkas Jayuda
Pamungkas Jayuda

Reputation: 1280

Problems on CSS. i am add with this : 

label {
    font-family: 'Roboto', Roboto;
}

And work weel. Thanks Mr. @nathanael

Upvotes: 1

Nathanael
Nathanael

Reputation: 5399

I tested this in a test app; and I have the following code, pretty close to unmodified: Here is the XML:

<Page id="Page" onloaded="pageLoaded" class="">
    <ListView items="{{ pakets }}" itemTap="onTap">
        <ListView.itemTemplate>
            <grid-layout rows="220, *, *, *" columns="*" id="cardReport" tap="goReport">
                <image row="0" src="{{ foto }}"  stretch="fill"/>
                <Label row="1" text="{{ textValue }}" />
                <Label row="2" text="{{ numberValue }}" />
                <Label row="3" text="{{ dateValue }}" />
            </grid-layout>
        </ListView.itemTemplate>
    </ListView>
</Page>

Here is the JavaScript:

var Observable = require('data/observable').Observable;
var myData = new Observable();

exports.pageLoaded = function(args) {
    var page = args.object;
    myData.pakets = [
        {foto: '~/SO587/nslogo.png', textValue: 'Text', numberValue: 2330, dateValue: '2016-01-01'},
        {foto: '~/SO587/gswn.png', textValue: 'Text', numberValue: 2230, dateValue: new Date()},
    ];
    page.bindingContext = myData;
};

And here is how it looks: As you can see from the above data, I have Text, number, Text Date and the second data line has Text, number and a real Date field.

enter image description here

Upvotes: 2

Related Questions