Javascript 用角JS过滤月份

Javascript 用角JS过滤月份,javascript,json,angularjs,asp.net-mvc,Javascript,Json,Angularjs,Asp.net Mvc,我有一个链接到dropdownlist的数组 $scope.Months = [ { Name: "Month", Value: undefined }, { Name: "Jan", Value: 1 }, { Name: "Feb", Value: 2

我有一个链接到dropdownlist的数组

$scope.Months =
    [
        {
            Name: "Month",
            Value: undefined
        },

        {
            Name: "Jan",
            Value: 1
        },

        {
            Name: "Feb",
            Value: 2
        },

        {
            Name: "Mar",
            Value: 3
        },

        {
            Name: "Apr",
            Value: 4
        },

        {
            Name: "May",
            Value: 5
        },

        {
            Name: "Jun",
            Value: 6
        },

        {
            Name: "Jul",
            Value: 7
        },

        {
            Name: "Aug",
            Value: 8
        },

        {
            Name: "Sep",
            Value: 9
        },

        {
            Name: "Oct",
            Value: 10
        },

        {
            Name: "Nov",
            Value: 11
        },

        {
            Name: "Dec",
            Value: 12
        }
    ];
然后我收到一个数据数组:

$scope.Data = 
[
{
Name: "Example Jan", 
Month: 1
},
{
Name: "Example Jan2", 
Month: 1
},
{
Name: "Example Feb", 
Month: 2
},
{
Name: "Example Feb2", 
Month: 2
},
{
Name: "Example Nov", 
Month: 11
},
{
Name: "Example Nov2", 
Month: 11
}
]
这里的问题是,无论何时在DDL中选择一个月,它都应该只显示该月所属的数据。。。例如。。。选择十一月,它将显示月值等于11的所有数据

但我注意到,例如,当您选择一月时,它将显示其值中包含1的所有数据。。在本例中,为1和11

考虑到它是一个int而不是一个字符串,有没有解决这个问题的办法

更新: 这是我的HTML

<table class="submitted-requests sortableTable">
                    <thead>
                        <tr>
                            <th ng-click="Sort('Supervisor.Name')">
                                <span>
                                    Supervisor
                                </span>

                                <span class="glyphicon sort-icon" ng-show="SortKey=='Supervisor.Name'" ng-class="{'glyphicon-chevron-up':Reverse, 'glyphicon-chevron-down':!Reverse}">
                                </span>
                            </th>

                            <th ng-click="Sort('ObservationDateString')">
                                <span>
                                    Observation Date
                                </span>

                                <span class="glyphicon sort-icon" ng-show="SortKey=='ObservationDateString'" ng-class="{'glyphicon-chevron-up':Reverse, 'glyphicon-chevron-down':!Reverse}">
                                </span>
                            </th>
                        </tr>

                        <tr>
                            <th>
                                <input type="text" class="filter" maxlength="50" ng-model="SearchTerm.Supervisor.Name" />
                            </th>

                            <th>
                                <select class="filter" ng-options="month.Value as month.Name for month in Months track by month.Value" ng-model="SearchTerm.ObservationMonth"></select>

                                <select class="filter" ng-model="SearchTerm.ObservationYear">
                                    <option ng-repeat="year in Years | orderBy: 'year.Value'" value="{{year.Value}}">
                                        {{year.Name}}
                                    </option>
                                </select>
                            </th>
                        </tr>
                    </thead>

                    <tbody>
                        <tr dir-paginate="record in Records | filter:SearchTerm | itemsPerPage:PageSize" pagination-id="recordPaging">
                            <td>
                                {{record.Supervisor.Name}}
                            </td>

                            <td>
                                {{record.ObservationDateString}}
                            </td>
                        </tr>
                    </tbody>
                </table>

                <dir-pagination-controls pagination-id="recordPaging" max-size="10" direction-links="true" boundary-links="true">
                </dir-pagination-controls>

您需要定义一个自定义筛选器函数,并在调用筛选器时使用它。大概是这样的:

JS

app.controller('MainCtrl', function($scope) {
  $scope.currentMonth = 1;
  $scope.Data = [];

  $scope.monthMatch = function(month) {
    return function(item) {
      return item.Month == month;
    };
  };
});
HTML

<body ng-controller="MainCtrl">
  <div ng-repeat="item in Data | filter:monthMatch(currentMonth)">
    {{ item }}
  </div>
</body>

{{item}}

示例:

您需要定义一个自定义筛选器函数,并在调用筛选器时使用它。大概是这样的:

JS

app.controller('MainCtrl', function($scope) {
  $scope.currentMonth = 1;
  $scope.Data = [];

  $scope.monthMatch = function(month) {
    return function(item) {
      return item.Month == month;
    };
  };
});
HTML

<body ng-controller="MainCtrl">
  <div ng-repeat="item in Data | filter:monthMatch(currentMonth)">
    {{ item }}
  </div>
</body>

{{item}}

示例:

我们可以查看您的HTML标记吗?完成。。。我更新了postCan我们看到你的HTML标记了吗?完成。。。我更新了帖子,我试过了,但没有成功。。。不确定这是否与我拥有的多个过滤选项有关。。。或者我在测试时遗漏了什么。我已经更新了我的帖子,可能是我在第一个节目中遗漏了什么。我添加了一个工作小提琴,也许它会帮助你发现问题。我尝试过,但没有成功。。。不确定这是否与我拥有的多个过滤选项有关。。。或者我在测试时遗漏了什么。我已经更新了我的帖子,可能是我在第一场秀中遗漏了什么。我添加了一把工作小提琴,也许它会帮助你发现问题。