簡體   English   中英

角度UI網格過濾器代碼不起作用

[英]Angular UI-grid filter code not working

以下代碼與教程http://ui-grid.info/docs/#/tutorial/321_singleFilter中的代碼相似,但它不顯示數據網格,我不確定為什么

我檢查了一下子,找不到任何錯誤,下面是我的代碼

var app = angular.module('app', ['ngTouch', 'ui.grid'])

app.controller('MainCtrl', function($scope) {

    $scope.gridOptions = {
        enableFiltering: false,
        onRegisterApi: function(gridApi) {
            $scope.gridApi = gridApi;
            $scope.gridApi.grid.registerRowsProcessor($scope.singleFilter, 200);
        },
        columnDefs: [
            {
                field: 'name'
            }, {
                field: 'last'
            }, {
                field: 'address'
            }, {
                field: 'name1'
            }, {
                field: 'last1'
            }, {
                field: 'address1'
            }, {
                field: 'last45'
            }
        ],
        data: [
            {
                "name": "test",
                "last": "test2",
                "address": "test3",
                "name1": "test",
                "last1": "test2",
                "address1": "test3",
                "last45": "op"
            }, {
                "name": "test",
                "last11": "test2",
                "address": "test2"
            }, {
                "name": "test",
                "last": "test2",
                "address": "test3"
            }, {
                "name": "test",
                "last": "test2",
                "address": "test3"
            }, {
                "name": "test",
                "last": "test2",
                "address": "test3"
            }, {
                "name": "test",
                "last": "test2",
                "address": "test3"
            }, {
                "name": "test",
                "last": "test2",
                "address": "test3"
            }
        ]
    };


    $scope.filter = function() {
        $scope.gridApi.grid.refresh();
    };

    $scope.singleFilter = function(renderableRows) {
        var matcher = new RegExp($scope.filterValue);
        renderableRows.forEach(function(row) {
            var match = false;
            ['name', 'last', 'address'].forEach(function(field) {
                if (row.entity[field].match(matcher)) {
                    match = true;
                }
            });

            if (!match) {
                row.visible = false;
            }
        });
        return renderableRows;
    };
})

您的問題似乎是由於數據。 由於您的數據沒有每一行的所有列。 您將必須修復singleFilter方法以檢查這種情況。

$scope.singleFilter = function(renderableRows) {
var matcher = new RegExp($scope.filterValue);
renderableRows.forEach(function(row) {
  var match = false;
  ['name', 'last', 'address'].forEach(function(field) {

    if (row.entity[field] && row.entity[field].match(matcher)) {
      match = true;
    }
  });
  if (!match) {
    row.visible = false;
  }
});
return renderableRows;
};

檢查此plnk的工作版本http://plnkr.co/edit/l7Uc3H0CnoyRkaHdNZ9P?p=preview

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM