Angularjs-NgTable在重新加载时未定义

Question

我使用Angularjs NgTable，在AngularjsMaterial提供的tab中进行分页。这很好用。我在项目的许多部分都使用过它，并在不同的部分多次重新加载。

但在这种情况下，我无法重新加载表。不知道问题出在哪里，也不知道该如何重新加载。

我在DistribucionController中有以下功能：

$scope.listaFacturaTierra = function () {
    var idFactura = $stateParams.idFactura;
    $facturaTierra = distribucionService.getStockTierra(idFactura);
    $facturaTierra.then(function (datos) {
        $scope.facturaTierra = datos.data;
        var data = datos;
        $scope.tableFacturaTierra = new NgTableParams({
            page: 1,
            count: 8
        }, {
            total: data.length,
            getData: function (params) {
                data = $scope.facturaTierra;
                params.total(data.length);
                if (params.total() <= ((params.page() - 1) * params.count())) {
                    params.page(1);
                }
                return data.slice((params.page() - 1) * params.count(), params.page() * params.count());
            }});
    });
};
$scope.listaFacturaBebelandia = function () {
    var idFactura = $stateParams.idFactura;
    $facturaBebelandia = distribucionService.getStockBebelandia(idFactura);
    $facturaBebelandia.then(function (datos) {
        var data = datos.data;
        $scope.facturaBebelandia = datos.data;
        $scope.tableFacturaBebelandia = new NgTableParams({
            page: 1,
            count: 10
        }, {
            total: data.length,
            getData: function (params) {
                data = $scope.facturaBebelandia;
                params.total(data.length);
                if (params.total() <= ((params.page() - 1) * params.count())) {
                    params.page(1);
                }
                return data.slice((params.page() - 1) * params.count(), params.page() * params.count());
            }});
    });
};
$scope.listaFacturaLibertador = function () {
    var idFactura = $stateParams.idFactura;
    $facturaLibertador = distribucionService.getStockLibertador(idFactura);
    $facturaLibertador.then(function (datos) {
        var data = datos.data;
        $scope.facturaLibertador = datos.data;
        $scope.tableFacturaLibertador = new NgTableParams({
            page: 1,
            count: 10
        }, {
            total: data.length,
            getData: function (params) {
                data = $scope.facturaLibertador;
                params.total(data.length);
                if (params.total() <= ((params.page() - 1) * params.count())) {
                    params.page(1);
                }
                return data.slice((params.page() - 1) * params.count(), params.page() * params.count());
            }});
    });
};

它们显示得很好，分页也在工作。

我使用Angularjs Material ngDialog添加元素，使用3个函数来制作过程。

显示主要模态：

$scope.distribuirModal = function (producto) {
    $rootScope.modalProducto = producto;
    ngDialog.open({
        template: 'views/modals/distribucion/modal-distribuir.html',
        className: 'ngdialog-theme-advertencia',
        showClose: false,
        controller: 'DistribucionController',
        closeByDocument: false,
        closeByEscape: false
    });
};

对数据进行处理，并显示一种确认模式：

$scope.confirmarDistribuir = function (modalDistribuir) {
    var control = 0;
    control = modalDistribuir.tierra + modalDistribuir.bebelandia + modalDistribuir.libertador;
    if (control === $rootScope.modalProducto.cantidadTotal) {
        if (modalDistribuir.tierra !== null) {
            $scope.wrapper.stockTierra.idProducto = $rootScope.modalProducto;
            $scope.wrapper.stockTierra.cantidad = modalDistribuir.tierra;
        }
        if (modalDistribuir.bebelandia !== null) {
            $scope.wrapper.stockBebelandia.idProducto = $rootScope.modalProducto;
            $scope.wrapper.stockBebelandia.cantidad = modalDistribuir.bebelandia;
        }
        if (modalDistribuir.libertador !== null) {
            $scope.wrapper.stockLibertador.idProducto = $rootScope.modalProducto;
            $scope.wrapper.stockLibertador.cantidad = modalDistribuir.libertador;
        }
        ngDialog.open({
            template: 'views/modals/distribucion/confirmacion-distribuir.html',
            className: 'ngdialog-theme-advertencia',
            showClose: false,
            controller: 'DistribucionController',
            closeByDocument: false,
            closeByEscape: false,
            data: {
                'wrapper': $scope.wrapper,
                'producto': $rootScope.modalProducto
            }
        });
    } else {
        $scope.alerts.push({
            type: 'danger',
            msg: 'La cantidad total de productos a distribuir debe ser igual a la cantidad total de productos en almacen.'
        });
    }
};

在这个模式中，我执行一个函数，将数据保存在我的API 上

$scope.finalizarDistribucion = function () {
    $scope.sendWrapper = {
        stockTierra: null,
        stockBebelandia: null,
        stockLibertador: null
    };
    if ($scope.ngDialogData.wrapper.stockTierra.idProducto !== null && $scope.ngDialogData.wrapper.stockTierra.cantidad) {
        $scope.sendWrapper.stockTierra = $scope.ngDialogData.wrapper.stockTierra;
    }
    if ($scope.ngDialogData.wrapper.stockBebelandia.idProducto !== null && $scope.ngDialogData.wrapper.stockBebelandia.cantidad) {
        $scope.sendWrapper.stockBebelandia = $scope.ngDialogData.wrapper.stockBebelandia;
    }
    if ($scope.ngDialogData.wrapper.stockLibertador.idProducto !== null && $scope.ngDialogData.wrapper.stockLibertador.cantidad) {
        $scope.sendWrapper.stockLibertador = $scope.ngDialogData.wrapper.stockLibertador;
    }
    $distribute = distribucionService.add($scope.sendWrapper);
    $distribute.then(function (datos) {
        if (datos.status === 200) {
            ngDialog.closeAll();
            toaster.pop({
                type: 'success',
                title: 'Exito',
                body: 'Se ha distribuido con exito los productos.',
                showCloseButton: false
            });
        }
    });
    $scope.$emit('updateTables', $scope.ngDialogData.producto);
    $scope.$emit('updateStock', {});
};

在这个函数中，我做两个$emit

第一个更新我的ProductoController中的对象Producto，并发送$broadcast来更新我的主表

$scope.$on('updateTables', function (event, object) {
    var idFactura = parseInt($stateParams.idFactura);
    object.estadoDistribucion = true;
    $updateProducto = _productoService.update(object);
    $updateProducto.then(function (datos) {
        if (datos.status === 200) {
            $rootScope.$broadcast('updateTableProducto', {'idFactura': idFactura});
        }
    });
});

最后一个操作很好，可以毫无问题地重新加载表。

第二个$emit是问题所在，它必须重新加载另外3个表

$scope.$on('updateStock', function () {
    var idFactura = parseInt($stateParams.idFactura);
    $facturaTierra = distribucionService.getStockTierra(idFactura);
    $facturaTierra.then(function (datos) {
        $scope.facturaTierra = datos.data;
        $scope.tableFacturaTierra.reload();
    });
    $facturaBebelandia = distribucionService.getStockBebelandia(idFactura);
    $facturaBebelandia.then(function (datos) {
        $scope.facturaBebelandia = datos.data;
        $scope.tableFacturaBebelandia.reload();
    });
    $facturaLibertador = distribucionService.getStockLibertador(idFactura);
    $facturaLibertador.then(function (datos) {
        $scope.facturaLibertador = datos.data;
        $scope.tableFacturaLibertador.reload();
    });
});

但是我的ngTable参数是CCD_ 8，重新加载失败。

有人知道我做错了什么吗？

Answer 1

经过多次尝试，我终于得到了答案。

首先，在我的ProductoController中，我对DistribucionController 进行了$broadcast

$rootScope.$on('updateTableProducto', function (event, object) {
    $list = _productoService.searchByIdFactura(object.idFactura);
    $list.then(function (datos) {
        $scope.productosFactura = datos.data;
        $rootScope.$broadcast('updateStock', {});
        $scope.tableProductosFactura.reload();
    });
});

然后，我在另一个使用的控制器上收到这个$broadcast

$scope.$on('updateStock', function (event, object) {
    var idFactura = parseInt($stateParams.idFactura);
    $facturaTierra = distribucionService.getStockTierra(idFactura);
    $facturaTierra.then(function (datos) {
        $scope.facturaTierra = datos.data;
        $scope.tableFacturaTierra.reload();
    });
    $facturaBebelandia = distribucionService.getStockBebelandia(idFactura);
    $facturaBebelandia.then(function (datos) {
        $scope.facturaBebelandia = datos.data;
        $scope.tableFacturaBebelandia.reload();
    });
    $facturaLibertador = distribucionService.getStockLibertador(idFactura);
    $facturaLibertador.then(function (datos) {
        $scope.facturaLibertador = datos.data;
        $scope.tableFacturaLibertador.reload();
    });
});

注意：如果我写$rootScope.on，它会执行3次。所以在CCD_ 14中只进行一个循环。

我希望这对某人有帮助。