尝试创建服务以构建我的NgTable

时间:2019-07-04 13:58:34

标签: angularjs service ngtable

我正在尝试创建一个将NgTableParams返回给我的服务,所以我不需要每次需要一个表时都要做。

我能够做到这一点并且有效,但是仅当我在控制器中只有一个表使用它时,如果我尝试在第二个表中使用它,就像服务将第一和第二个表的参数弄乱了一样然后停止工作。

我试图将服务更改为工厂,并尝试对服务进行复制。因此,每个副本都创建了一个不同的表,但仍然有效。

每次我需要一张桌子都是这样的:

$scope.tableParams = NgTableDataService.getGenericTableParams($scope.onboardcomputerstatus, $scope.filterObject);

$scope.searchTable = { filter: '' };
$scope.tableParams = new NgTableParams({
    count: $scope.session.user.tablePagination,
    filter: $scope.searchTable.filter
}, {
    counts: rowsPerPageTemplate,
    getData: function (params) {
        var funcFilter = function (item) {

            var pfilter = params.filter().filter.toUpperCase();
            return item.onboardComputer.id.toString().indexOf(pfilter) >= 0
                || (!!item.onboardComputer.remainingMonitoringMsgs ? item.onboardComputer.remainingMonitoringMsgs : "").toString().indexOf(pfilter) >= 0
                || $filter('date')((!!item.onboardComputer.oldestMonitoringTimestamp ? item.onboardComputer.oldestMonitoringTimestamp : ""), Session.get().company.dateHourFormatHTML).indexOf(pfilter) >= 0
                || $filter('date')((!!item.lastCommunicatio ? item.lastCommunicatio : ""), Session.get().company.dateHourFormatHTML).indexOf(pfilter) >= 0
                || $filter('date')((!!item.lastRegister ? item.lastRegister : ""), Session.get().company.dateHourFormatHTML).indexOf(pfilter) >= 0
                || item.vehicle.code.toUpperCase().indexOf(pfilter) >= 0
                || item.vehicle.name.toUpperCase().indexOf(pfilter) >= 0;
        }
        filteredData = params.filter() ? $filter('filter')($scope.onboardcomputerstatus, funcFilter) : $scope.onboardcomputerstatus;
        if (!!filteredData && filteredData.length >= 0) {
            params.total(filteredData.length);
            var rowsPerPageTemplateWithAllData = rowsPerPageTemplate.slice();
            var isFound = rowsPerPageTemplateWithAllData.some(function (element) {
                return element === filteredData.length;
            });
            var filteredDataLength = filteredData.length + (isFound ? 1 : 0);
            rowsPerPageTemplateWithAllData.push(filteredDataLength);
            params.settings().counts = rowsPerPageTemplateWithAllData;
            if (params.count() === MY_CONSTANTS.TABLE_PAGINATION_ALL) {
                params.count(filteredDataLength);
            }
            if (params.total() <= params.count()) {
                params.page(1);
            }
            var x = $filter('orderBy')(filteredData, params.orderBy());
            var y = x.slice((params.page() - 1) * params.count(), params.page() * params.count());
            return y;
        } else {
            return null;
        }
    }
});

所以我试图做一个像这样的工厂:

angular.module('control-room').factory('NgTableDataFactory', function (
    $filter,  MY_CONSTANTS, NgTableParams, Session
) {

    var ngTableObj = {};

    ngTableObj.tableData = {};
    ngTableObj.filterObject = {};
    ngTableObj.session = Session.get();
    ngTableObj.defaultDateFormat = (!!ngTableObj.session.company ? ngTableObj.session.company.dateHourFormatHTML : null);
    ngTableObj.tablePagination = (!!ngTableObj.session.user ? ngTableObj.session.user.tablePagination : MY_CONSTANTS.QTD_REG_TAB_INDEX);

    ngTableObj.NgTableParamsFactory = new NgTableParams({
        count: ngTableObj.tablePagination,
        filter: ""
    }, {
        counts: rowsPerPageTemplate,
        getData: function (params) {
            if (!!params.filter().filter && params.filter().filter != '') {
                var pfilter = params.filter().filter.toUpperCase();
            } else {
                var pfilter = '';
            }
            let filteredData = params.filter() ? $filter('filter')(ngTableObj.tableData, ngTableObj.funcFilterFactory(ngTableObj.filterObject, pfilter)) : ngTableObj.tableData;
            if (!!filteredData && filteredData.length >= 0) {
                params.total(filteredData.length);
                var rowsPerPageTemplateWithAllData = rowsPerPageTemplate.slice();
                var isFound = rowsPerPageTemplateWithAllData.some(function (element) {
                    return element === filteredData.length;
                });
                var filteredDataLength = filteredData.length + (isFound ? 1 : 0);
                rowsPerPageTemplateWithAllData.push(filteredDataLength);
                params.settings().counts = rowsPerPageTemplateWithAllData;
                if (params.count() === MY_CONSTANTS.TABLE_PAGINATION_ALL && filteredDataLength > 0) {
                    params.count(filteredDataLength);
                }
                var x = $filter('orderBy')(filteredData, params.orderBy());
                var y = x.slice((params.page() - 1) * params.count(), params.page() * params.count());
                return y;
            } else {
                return null;
            }
        }
    });

    ngTableObj.findPropertyValue = function (obj, propertyList){
        let aux = obj;
        for(property of propertyList){
            aux = aux[property];
        }
        return aux
    };

    ngTableObj.funcFilterFactory = function (f_Object, p_filter) {
        return function (item) {
            var result = false;
            if (!!f_Object.columnNames) {
                f_Object.columnNames.forEach(function (row) {
                    if (!result){
                        const propertyValue = ngTableObj.findPropertyValue(item, row.split('.'));
                        result = (propertyValue ? propertyValue.toString() : "").toUpperCase().indexOf(p_filter) >= 0 || result;
                    }
                });
            };
            if (!!f_Object.translateNames) {
                f_Object.translateNames.forEach(function (row) {
                    if (!result){
                        const propertyValue = ngTableObj.findPropertyValue(item, row.split('.'));
                        result = $filter('translate')((propertyValue != null ? propertyValue.toString() : "").toUpperCase()).indexOf(p_filter) >= 0 || result;
                    }
                });
            }
            if (!!f_Object.dateFormat) {
                f_Object.dateFormat.forEach(function (row) {
                    if (typeof(row) == 'string') {
                        if (!result) {
                            const propertyValue = ngTableObj.findPropertyValue(item, row.split('.'));
                            result = propertyValue ? $filter('date')(propertyValue, ngTableObj.defaultDateFormat).toUpperCase().indexOf(p_filter) >= 0 : false || result;
                        }
                    }else {
                        if (!result) {
                            const propertyValue = ngTableObj.findPropertyValue(item, row[0].split('.'));
                            result = propertyValue ? $filter('date')(propertyValue, row[1]).toUpperCase().indexOf(p_filter) >= 0 : false || result;
                        }
                    }
                });
            }
            return result;
        };
    };
    return ngTableObj
});

并且在控制器中是这样的:

$scope.filterObject = {
    columnNames : ['onboardComputer.id', 'onboardComputer.remainingMonitoringMsgs', 'vehicle.code', 'vehicle.name' ],
    dateFormat : ['onboardComputer.oldestMonitoringTimestamp', 'lastCommunicatio', 'lastRegister' ]
};

$scope.tableFactory = NgTableDataFactory;
$scope.tableFactory.tableData = $scope.onboardcomputerstatus;
$scope.tableFactory.filterObject = $scope.filterObject;
$scope.tableFactory.session = Session.get();

$scope.tableParams = $scope.tableFactory.NgTableParamsFactory

就像我说的那样,它可以很好地工作,但是只有当我使用一次,如果我有2张桌子,它就会停止工作

0 个答案:

没有答案