I am using primeNg library, I don't want to use a for loop inside my angular component to format my date from String to date, is there a way we can directly call component function inside p-column
<p-column field="new Date(createdDate)" [header]="'InputLabel.hold_date_text' | translate"></p-column>
new Date inside p-column doesn't work. is there a way arround
Thanks in advance.
You can't call function in field attribute. If you want, then you could use template like this below way
<p-column field="createdDate" header="Create Date" >
<template let-col let-appdt="rowData" pTemplate="body">
<span>{{new Date(appdt[col.field])}}</span>
</template>
</p-column>
Related
Using primeng table to display the data as grid.
Using below code to display testdate with date format.I would like to display the format part(YYYY-MM-dd) in second line of column.Please suggest
<p-column field="testdate" header="Test Date (YYYY-MM-dd)" [sortable]="true"
[style]="{'width':'150px'}"></p-column>
Use ng-template for that :
<p-column field="testdate" header="Test Date (YYYY-MM-dd)" [sortable]="true"
[style]="{'width':'150px'}" let-testdate="rowData.testdate">
<ng-template pTemplate="body">
{{testate | date: 'YYYY-MM-dd'}}
</ng-template>
</p-column>
I need to use ngIf in a p-column, but I don't how to get value of datatable.
On primefaces I have "var" option in p:dataTable
I need this:
<p-dataTable [value]="objectList" >
<p-column *ngIf="object.property"></p-column>
</p-dataTable>
I have a requirement to present a time input field using a timezone offset determined by the selection of a user-profile on the same form.
I am defining a getTzOffset fn on scope in a link function so that I can use it in ng-model-options like this:
<input ng-model="myTimeObject" type="time" ... ng-model-options="{timezone: getTzOffset()}" ... >
But that doesn't work. getTzOffset never gets called.
I'm using a datepicker with the input field, which requires a timezone. I don't need a modified date object or a string representation of it, I need the timezone-offset so the datepicker can know how to translate the date object properly into UTC time. I need that timezone to change when a different user is selected through the interface.
Is there any way to dynamically change an ng-model-options property?
You can use the angular date filter option : timezone.
Sample Plunker.
The idea is to use the third parameter to the date filter and make it changeable via a variable.
{{ inputTime | date: "HH:mm:ss": tzInput }}
You could also use $filter to generate values in code and store it, like:
$scope.inputTime = $filter('date')($scope.inputTime , "HH:mm:ss", $scope.tzInput);
I use datetime picker in this way:
<datetimepicker
hour-step="vm.hourStep"
minute-step="vm.minuteStep"
ng-model="vm.time"
show-meridian="vm.showMeridian"
show-date="false"
show-spinners="true"
readonly-time="false"></datetimepicker>
and it shows the input like this way:
Is it possible to don't show the first input (date) with directive attribute (or css if no attribute is available) - I only need the time adjustment.
Thanks a lot!
There is a Timepicker (ui.bootstrap.timepicker) available from here. Use it like this:
<uib-timepicker ng-model="mytime" ng-change="changed()" hour-step="hstep" minute-step="mstep" show-meridian="ismeridian"></uib-timepicker>
I want to do a two way data-binding from my view to controller. is it possible to do it using ng-model? it displays undefined in the controller though.
My code is something like:
<span ng-model="xyz">${user.group}</span>
and in my controller:
console.log($scope.xyz); //returns undefined.
What is the use of ng-model if I cannot use it this way?
Can anyone suggest a workaround for this?
Your problem is that the ng-model must be bound to an actual value. Spans do not have a value associated to them like inputs do so your $scope.xyz would never be set unless you set it in the scope. Even after that it would not do anything with the span. You also need double {{ and }} around everything, not single {}. You also do not need the $ symbol in the html.
Try :
<input type="text" ng-model="xyz" /> <span> {{xyz}} </span>
Got it working, I was missing to pass the argument to this function as a string, I simply had to do this using ng-bind on span tag like this:
ng-bind="getGp('${user.group}')"
Thanks everyone.