Question

我有一个html表，数据是从角度js绑定的。结构就像那样

<tr ng-repeat="item in List| filter: { MachineType: 'Physical' }">


     <td>{{item.MachineType}}</td>


</tr>

我想动态地从动态设置的html隐藏字段传递过滤器值。

我如何阅读Html隐藏字段值并传入过滤器..

由于

Answer 1

我假设你想根据另一个动态字段过滤一些数据。

以下是基于搜索查询过滤的示例。

<p><input type="hidden" ng-model="test"></p>
<ul>
  <li ng-repeat="x in names | filter : test">
    {{ x }}
  </li>
</ul>

您也可以制作自定义过滤器。你提出的问题有点宽泛，所以我认为这个link可以帮助解决大量的过滤查询问题。

Answer 2

您可以在隐藏元素上设置 ng-model ，然后将其传递给过滤器。以下是您可以做到的最简单的方法之一。

<input type="hidden" ng-model="myMachineTypw" />

<tr ng-repeat="item in List| filter: { MachineType: myMachineTypw }">
     <td>{{item.MachineType}}</td>
</tr>

另一种方式是，你说你正在设置动态隐藏的值吗？那么您甚至不需要隐藏元素，只需更新 $ scope.myMachineType 的值并使用 myMachineType ，如上例所示，然后删除隐藏的元素。

<script type="text/javascript">
    angular
        .module('myApp')
        .controller('myCtrl', myCtrl);

    myCtrl.$inject = ['$scope'];

    function myCtrl ($scope) {
        $scope.myMachineType = "anyValue";
    }
</script>

<tr ng-repeat="item in List| filter: { MachineType: myMachineType }">
     <td>{{item.MachineType}}</td>
</tr>

以下是工作示例：

＆＃13;

angular.module('myApp', []);

angular
    .module('myApp')
    .controller('myAppController', myAppController);

myAppController.$inject = ['$scope'];

function myAppController ($scope) {

    $scope.processing = true;

    $scope.init = init;

    function init () {
        $scope.List = [
          {'name':'Item 1', 'MachineType': 'Type1'},
          {'name':'Item 2', 'MachineType': 'Type2'},
          {'name':'Item 3', 'MachineType': 'Type3'},
          {'name':'Item 4', 'MachineType': 'Type2'},
          {'name':'Item 5', 'MachineType': 'Type1'},
          {'name':'Item 6', 'MachineType': 'Type1'},
          {'name':'Item 7', 'MachineType': 'Type3'},
          {'name':'Item 8', 'MachineType': 'Type1'},
          {'name':'Item 9', 'MachineType': 'Type3'},
          {'name':'Item 10', 'MachineType': 'Type3'}
        ];

        $scope.setType = function (x) {
            if ( x ) {
                $scope.myMachineType = "Type"+x;
            } else {
                $scope.myMachineType = "";
            }
        }

    }
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myAppController" ng-init="init();">
    <button ng-click="setType();">Show All</button>
    <button ng-click="setType(1);">Type 1</button>
    <button ng-click="setType(2);">Type 2</button>
    <button ng-click="setType(3);">Type 3</button>
    <table>
        <tr ng-repeat="i in List | filter: { MachineType: myMachineType }">
             <td>{{i.name}} : {{i.MachineType}}</td>
        </tr>
    </table>
</div>

＆＃13;

在html表绑定中读取ng-repeat内的隐藏字段的值

2 个答案: