javascript - AngularJS list not showing - issue with custom filter? -


i trying troubleshoot why "upcoming events" list not show? live demo here (code shown below)

here's angularjs view:

<body ng-app="listapp">  <div class="container" ng-controller="eventcontroller">   <h3>upcoming events:</h3>      <ul ng-repeat="event in events | upcomingevents | limitto: 2">         <li>{{ event.title }}</li>         <li>{{ event.start }}</li>     </ul>  </div>

here's controller , custom filter:

<script type="text/javascript" src="angularjs/angular.min.js"></script> <script>  var app = angular.module('listapp', []);  app.controller('eventcontroller', function($scope, $http){     $http.get('events.json').success(function(data) {              $scope.events = data;     }) });      app.filter('upcomingevents', function () {      return function (input) {      var upcomingevents = [];      upcomingevents = input.filter(function (data) {         var currentdate = new date();          if ((data.start - currentdate) >= 0) {             return true;         } else {             return false;         }     });      upcomingevents.sort(function (a, b) {         return a.start - b.start;     });      return upcomingevents;   }; });  </script>

here's events.json feed:

[   {     "title": "all day event",     "start": "2015-07-13",     "allday": true   },   {     "title": "long event",     "start": "2015-07-05",     "end": "2015-07-13"   },   {     "title": "repeating event",     "start": "2015-07-15",     "allday": false   },   {       "title": "first time",       "start": "2015-07-31"   } ]

i getting error in chrome's console, not sure means.

console error:

typeerror: cannot read property 'filter' of undefined @ http://ogmda.com/sandbox/listings.html:44:31 @ fn (eval @ <anonymous> (http://ogmda.com/sandbox/angularjs/angular.min.js:212:83), <anonymous>:2:191) @ object.<anonymous> (http://ogmda.com/sandbox/angularjs/angular.min.js:117:376) @ n.$get.n.$digest (http://ogmda.com/sandbox/angularjs/angular.min.js:132:124) @ n.$get.n.$apply (http://ogmda.com/sandbox/angularjs/angular.min.js:135:269) @ http://ogmda.com/sandbox/angularjs/angular.min.js:19:437 @ object.e [as invoke] (http://ogmda.com/sandbox/angularjs/angular.min.js:39:156) @ d (http://ogmda.com/sandbox/angularjs/angular.min.js:19:358) @ ac (http://ogmda.com/sandbox/angularjs/angular.min.js:20:151) @ zd (http://ogmda.com/sandbox/angularjs/angular.min.js:18:464)

anyone have advice on how can proceed fix? thanks.

change 

 if ((data.start - currentdate) >= 0)

to:

if ((new date(data.start) - currentdate) >= 0)

the data.start string representation of date. convert date 1st

fixed demo in fiddle

typeerror: cannot read property 'filter' of undefined

seems in code input value = undefined because on start don't have $scope.events , input.filter(...) fails.

so add in filter:

var upcomingevents = [];  if(!input){  return upcomingevents; }

or initiate $scope.events = [] in controller (best bet)


Comments

Post a Comment

Popular posts from this blog

javascript - Using jquery append to add option values into a select element not working -

i'm looking dynamically populate select element names of items stored array. for reason it's not working , i'm not sure why. html: <div class="col-md-4 col-md-offset-4"> <select class="select1"> </select> , <select class="select2"> </select> </div> note i'm using bootstrap layout. here's jquery i'm using try , populate ".select1" jquery: select: function() { $.each(state.greens, function(index, value) { $(".select1").append("<option value =' " + index + " '>" + state.greens[index].name + "</option>"); }); } note function 'select' stored within object called 'display'. state.greens name of array i'm trying access. so @ end of html page call display.select(); call function. no error messages showing in console. also, saw question: appending
Read more

Android soft keyboard reverts to default keyboard on orientation change -

i'm building android soft keyboard , can't seem fix bug - have arabic , qwerty keyboard , when rotate device on qwerty keyboard (or arabic shift), it's if program has "restarted" , becomes arabic keyboard without shift. the onsaveinstancestate(bundle savedinstancestate) not work because application not extend activity inputmethodservice . i put following in android manifest android:configchanges="keyboard|keyboardhidden|orientation" android:windowsoftinputmode="stateunchanged|adjustresize"> i tried using @override public void onconfigurationchanged(configuration newconfig) { super.onconfigurationchanged(newconfig); log.i(mydebug, "config changed " + currentkeyboard.equals(qwerty)); } however, currentkeyboard.equals(qwerty)) results false , made sure true before orientation change. any appreciated. i think applications fault. if application restarting on orientation change
Read more

jquery - javascript onscroll fade same class but with different div -

i new @ javascript , want learn new. there wrong code : why div fades @ same time. i want ask how fade different div s same class name.can me , explain me. thanks in advance. javascript: $(window).scroll(function(){ if ($( "div.fade" ).offset().top - $(window).scrolltop() <= 100){ $('.fade').addclass( "fade-in"); } else { $('.fade').removeclass("fade-in"); } }); here jsfiddle onscroll = function () { var scrolltop = $(this).scrolltop() ; $("div.fade").each(function(){ if(($(this).offset().top - scrolltop) <= 100){ $(this).toggleclass("fade-in"); } }) }
Read more