CODEWITHSUNDEEP
javascriptangularjs
stack questions
stack questions

Reputation: 982

Date is not defined error in angularjs

I am trying to print a date and time in my page with values coming from an Sql Server. The format of the date that is returned is like so:

/Date(1510563600000)/

angular

$filter('date')(date, format, timezone)  

$scope.GetTimelineByUserIdAndProjectId = function (userId, projectId) {
    var obj = { "userId": userId, "projectId": projectId }
    $http.post('/Admin/GetTimelineByUserIdAndProjectId', obj)
    .then(function (response) {
        $scope.userTimeline = response.data;
    }) 
}

html

<ul class="timeline timeline-inverse" ng-repeat="u in userTimeline">
<li class="time-label">
    <span class="bg-red">
        {{u.StartDateTime | date:'medium'}}
    </span>
</li>
<li>
    <i class="fa fa-clock-o bg-gray"></i>
</li>

I want the date format to be day/month/year hour:minutes.

When I run this program, I got the $filter is not defined so I place it in my controller like this:

var app = angular.module('adminApp', []);
app.controller('adminController', function ($scope, $http, $filter) {

but it then gives me an error of angular.js:14642 ReferenceError: date is not defined

Upvotes: 1

Views: 1297

Answers (2)

Kalaiselvan
Kalaiselvan

Reputation: 2134

here I have used multiple filters it could be helpful to you.

In your case, you have created a filter which is not linked to your app so that it causes error

var app = angular.module('adminApp', []);
//$filter('')(date, format, timezone)  
app.filter('date_filter',function(){
   return function(val){
    var n= val.replace('/Date(','').replace(')/','')      
    return n;
   }
})
app.controller('adminController', function ($scope, $http) {
$scope.StartDateTime="/Date(1510563600000)/";
$scope.GetTimelineByUserIdAndProjectId = function (userId, projectId) {
    var obj = { "userId": userId, "projectId": projectId }
    //$http.post('/Admin/GetTimelineByUserIdAndProjectId', obj)
    //.then(function (response) {
        //$scope.userTimeline = response.data;
       
        
    //}) 
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="adminApp" ng-controller="adminController">
{{StartDateTime|date_filter |date:'medium'}}
<br/>
{{StartDateTime|date_filter |date:'dd/MM/yyyy'}} 
<ul class="timeline timeline-inverse" ng-repeat="u in userTimeline">
<li class="time-label">
    <span class="bg-red">
        {{u.StartDateTime |date_filter| date:'medium'}}
    </span>
</li>
<li>
    <i class="fa fa-clock-o bg-gray"></i>
</li>
</div>

Upvotes: 2

jitender
jitender

Reputation: 10429

I assume you are getting date like1510563600000 if you are getting like /Date(1510563600000)/ then you have to simple convert this string to date in filter using javascript

var myApp = angular.module('myApp',[]);
myApp.controller('MyCtrl',function($scope, $timeout) {
$scope.varDate='1510563600000';
});

myApp.filter('date',function(){
return function(date,format){
var d=new Date(parseInt(date));
return d.getDate()+'/'+d.getMonth()+'/'+d.getFullYear()+' '+d.getHours()+':'+d.getMinutes()
}

})
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular.min.js"></script>
<div ng-app="myApp" ng-controller="MyCtrl">
{{varDate | date}}
</div>

Upvotes: 2

Related Questions