javascript - AngularJS datepicker to return snapshots -
hello looking provide datepicker (material kit ui) filters date of returned snapshots when return list of snapshot images on page. injector error: angular.js:13920 error: [$injector:unpr] unknown provider: dayfilterfilterprovider <- dayfilterfilter http://errors.angularjs.org/1.5.8/$injector/unpr?p0=dayfilterfilterprovider%20%3c-nanayfilterfilter
here directive:
(function () { "use strict"; app.controller("maincontroller", [ "$rootscope", "$scope", function ($rootscope, $scope) { $scope.dayfilter = null; $scope.dayfilter = function(items, date) { return function(items, date) { $rootscope.datefilter = date; var filtered = []; var begin, end begin = date.sethours(0, 0, 0); end = date.sethours(23, 59, 59); angular.foreach(items, function(item) { if (item > begin && item < end) { filtered.push(item) } }) console.log("filtered day", date) return filtered } }; $scope.dayfilter(new date(), 'date');
and here html:
<div class="dropdown"> <h3 class="dropdown-toggle" id="day-datetimepicker" role="button" data-toggle="dropdown" data-target="#"> {{ filtered.date ? filtered.date.label : 'day' }} <span class="caret"></span></h3> <ul class="dropdown-menu" role="menu" aria-labelledby="day-datetimepicker"> <datetimepicker data-ng-model="datefilter" data-datetimepicker-config="{ dropdownselector: '#day-datetimepicker', minview: 'day', startview: 'day' }" data-on-set-time="dayfilter(newdate, 'day')"></datetimepicker> </ul> </div> <a ng-repeat="s in chui.snapshot | dayfilter:'day' | orderby:'-date'" ng-click="select('snapshot', s); modal('snapshot-keyholder', true);" class="snapshot-thumbnail col-xs-6 col-sm-4 col-md-3 col-lg-2" >
let me know if have further questions. many in advance
in response first answer created module:
app.filter("dayfilter",[ function () { return function dayfilter(items,date) { var d = new date(); var filtereditems = []; var begin, end begin = d.sethours(0, 0, 0); end = d.sethours(23, 59, 59); angular.foreach(items, function(item) { if (item > begin && item < end) { filtered.push(item); } }) console.log("filtered day", d); return filtereditems } $filter("dayfilter"); // dayfilter(new date(),'date'); }]); no longer error, snapshots not appear in output, though following in console: iltered day thu nov 10 2016 23:59:59 gmt-0500 (cot) main.js?v=2016-11-08-3:89 filtered day thu nov 10 2016 23:59:59 gmt-0500 (cot) main.js?v=2016-11-08-3:89 filtered day thu nov 10 2016 23:59:59 gmt-0500 (cot) main.js?v=2016-11-08-3:89 filtered day thu nov 10 2016 23:59:59 gmt-0500 (cot) main.js?v=2016-11-08-3:89 filtered day thu nov 10 2016 23:59:59 gmt-0500 (cot) main.js?v=2016-11-08-3:89 filtered day thu nov 10 2016 23:59:59 gmt-0500 (cot) main.js?v=2016-11-08-3:89 filtered day thu nov 10 2016 23:59:59 gmt-0500 (cot) main.js?v=2016-11-08-3:89 filtered day thu nov 10 2016 23:59:59 gmt-0500 (cot) main.js?v=2016-11-08-3:89 filtered day thu nov 10 2016 23:59:59 gmt-0500 (cot)
the template using dayfilter
in ng-repeat
directive. add filter module, use module.filter
method:
app.filter("dayfilter", () => { return function dayfilter(items, date) { //filter code return filtereditems; }; });
to instantiate filter in controller, use $filter
service:
$filter("dayfilter");
for more information, see angularjs developer guide -- creating custom filters
Comments
Post a Comment