Question

我想只显示列表中输入字段中两个选定日期之间的项目。这是我的自定义控制器：

// Custom filter for comparing dates
snippet.filter('snippetsByDate', function(){
    return function(items, fromDate, toDate){
        var filtered = [];
        //here you will have your desired input
        var from_date = Date.parse(fromDate);
        var to_date = Date.parse(toDate);
        alert("From dateeeee " + from_date);
        angular.forEach(items, function(item) {
            if(Date.parse(item.created) >= from_date && Date.parse(item.created) <= to_date) {
                filtered.push(item);
            }
        });
        return filtered;
    };
});

过滤器函数中的alert（）返回undefined为变量fromDate和NaN为变量from_date。这就是我调用我的过滤器的方式：

<tr ng-repeat="s in snippets | filter:description | snippetsByDate : from_date : to_date">
                <td>{{s.description}}</td>
                <td>{{s.language}}</td>
                <td>{{s.url}}</td>
                <td>{{s.user}}</td>
</tr>

我的输入字段低于此代码（不知道是否为metters）并且看起来像这样：

<label>Filter snippets by date</label><br>
<label>From: </label>
<input type="date" ng-model="from_date"><br>
<label>To: </label>
<input type="date" ng-model="to_date">

当我从ng-repeat中删除自定义过滤器时，它工作正常，但是看起来我看起来像是空列表。

我应该提一下，在我的课程中，我将变量创建为java.util.Date类。

提前谢谢。

Answer 1

请检查此工作代码。

  <List>
    <Subheader>Nested List Items</Subheader>
    <ListItem primaryText="Sent mail" leftIcon={<ContentSend />} />
    <ListItem primaryText="Drafts" leftIcon={<ContentDrafts />} />
    <ListItem
      primaryText="Inbox"
      leftIcon={<ContentInbox />}
      initiallyOpen={true}
      primaryTogglesNestedList={true}
      nestedItems={[
        <ListItem
          key={1}
          primaryText="Starred"
          leftIcon={<ActionGrade />}
        />,
        <ListItem
          key={2}
          primaryText="Sent Mail"
          leftIcon={<ContentSend />}
          disabled={true}
          nestedItems={[
            <ListItem key={1} primaryText="Drafts" leftIcon={<ContentDrafts />} />,
          ]}
        />,
        <ListItem
          key={3}
          primaryText="Inbox"
          leftIcon={<ContentInbox />}
          open={this.state.open}
          onNestedListToggle={this.handleNestedListToggle}
          nestedItems={[
            <ListItem key={1} primaryText="Drafts" leftIcon={<ContentDrafts />} />,
          ]}
        />,
      ]}
    />
  </List>

var snippet = angular.module('plunker', []);
    snippet.filter('snippetsByDate', function () {
        return function (items, fromDate, toDate) {
            var filtered = [];
            //here you will have your desired input
            var from_date = Date.parse(fromDate);
            var to_date = Date.parse(toDate);
            if (from_date == null || toDate == null)
                filtered = items;
            else
                filtered = items.filter(function (item) {
                    return item.created >= from_date && item.created <= to_date;
                });
            return filtered;
        };
    });
    snippet.controller('MainCtrl', function ($scope) {
        $scope.snippets = [];
        for (var i = 0; i < 11; i++) {
            $scope.snippets.push({
                description: 'description-' + i,
                language: i % 2 == 0 ? 'Hindi' : 'English',
                url: 'url-' + i,
                user: 'User-' + i,
                created: new Date().setMonth(i)
            });
        }

    });

自定义过滤器，用于比较angularjs中的日期

1 个答案: