Question

我正在使用angularjs ng-tables通过django视图显示数据并尝试在ng-table中添加bootstrap日期范围过滤器，但它显示以下错误： -

错误：[$ injector：unpr]未知提供商： dateRangeFilterFilterProvider＆lt; - dateRangeFilterFilter

我想添加日期范围过滤器，以便我可以根据它搜索数据。过滤器是可见的，但是没有发生上述错误和过滤。我被困住了，没有得到我做错的地方。如果有人可以帮助我，那将是很棒的。

app.js

<div class="panel panel-default">

      <h4>From Date</h4>
      <p class="input-group">
         <input type="text" uib-datepicker-popup="{{table.format}}" ng-model="table.dt1" is-open="table.status1.opened"  max-date="'table.maxDate'" datepicker-options="table.dateOptions" date-disabled="table.disabled(date, mode)" ng-required="true"
         close-text="Close" class="form-control" />
         <span class="input-group-btn">
            <button type="button" ng-click="table.open1($event)" class="btn btn-default">
               <em class="fa fa-calendar"></em>
            </button>
         </span>
      </p>
      <h4>To Date</h4>
       <p class="input-group">
         <input type="text" uib-datepicker-popup="{{table.format}}" ng-model="table.dt2" is-open="table.status2.opened"  max-date="'table.maxDate'" datepicker-options="table.dateOptions" date-disabled="table.disabled(date, mode)" ng-required="true"
         close-text="Close" class="form-control" />
         <span class="input-group-btn">
            <button type="button" ng-click="table.open2($event)" class="btn btn-default">
               <em class="fa fa-calendar"></em>
            </button>
         </span>
      </p>
      <table ng-table="table.tableParams5" class="table" show-filter="true">
         <tbody>
            <tr ng-repeat="product_whole_data in $data | dateRangeFilter:dt1:dt2">
               <td data-title="'Channel'" filter="{ 'channel_name': 'text' }" sortable="'channel_name'" class="text-center">{{product_whole_data.channel_name}}</td>
               <td data-title="'Image'" filter="{ 'image_url': 'text' }" sortable="'image_url'"><div class="media"><img src="{{product_whole_data.image_url}}" alt="Image" class="media-box-object img-responsive img-rounded thumb64"></div></td>
               <td data-title="'Product Name'" filter="{ 'title': 'text' }" sortable="'title'" class="text-center">{{product_whole_data.title}}</td>
               <td data-title="'Seller Name'" filter="{ 'seller_name': 'text' }" sortable="'seller_name'" class="text-center">{{product_whole_data.seller_name}}</td>
               <td data-title="'Price'" filter="{ 'price': 'text' }" sortable="'price'" class="text-center">{{product_whole_data.price}}</td>
               <td data-title="'Product Rating'" filter="{ 'product_rating': 'text' }" sortable="'product_rating'" class="text-center">{{product_whole_data.product_rating}}</td>
               <td data-title="'Vendor Rating'" filter="{ 'vendor_rating': 'text' }" sortable="'vendor_rating'" class="text-center">{{product_whole_data.vendor_rating}}</td>

            </tr>
         </tbody>
      </table>
   </div>

HTML

$(".button").click(function(){
    $('#someDIV').empty();
    $('#someDIV').innerHTML($login)

});

Answer 1

更新：不是创建函数来返回解析日期，而是直接调用Date.parse（）

这是因为您在控制器中创建了过滤器。

   var myapp = angular
            .module('app.tables')
            .controller('NGTableCtrl', NGTableCtrl);

            // your filter should be here
            myapp.filter("dateRangeFilter", function() {
                return function(items, from, to) {
                  var df = Date.parse(from);
                  var dt = Date.parse(to);
              };
            });

        NGTableCtrl.$inject = ['$filter', '$http', 'ngTableParams', '$resource', '$timeout', 'ngTableDataService'];
        function NGTableCtrl($filter, $http, ngTableParams, $resource, $timeout, ngTableDataService) {
    // your existing code
    }

ng-table angularjs中的日期范围过滤器

1 个答案: