Question

我有一个UI网格组件，当你点击一行时，我希望它在页面上加载另一个ui网格组件的内容。您如何编写一个函数来告诉网格基于使用从第一个网格行中选择的参数的rest api调用来更新第二个网格？例如，第一个网格将是状态列表，第二个网格将显示所选状态内的所有城市。

Answer 1

以下是实现您所寻找目标的步骤。

注册Grid API
调用modifyRows
使用.get selectedRows（）将您的secoundary函数调用放入onRowSelection调用中以获取所有选定的行。

这是一个简单的例子：

$scope.yourGridName.onRegisterApi = function (gridApi) {
    // Set gridApi on scope, if you have more then one grid, 
    // Your grid api name (gApi in this case)must be unique
    $scope.gApi = gridApi;

    // Allow row modification 
    $scope.gApi.grid.modifyRows($scope.requestsGrid.data);

    // On a change of selection
    gridApi.selection.on.rowSelectionChanged($scope, function (row) {

        // Get current selected row, current row is an array
        var currentRow = $scope.gApi.selection.getSelectedRows();

        //put your secondary call for your second grid here ex:
        var config = {
            params : {param : currentRow[0].prop}
        }

        $scope.get("/your/URL", config)
               .then (function (data) { //success callback })
               .then (function (data, status...etc) { //error callback})
               .finally( function(data,...etc) {//reset your grid})
    });
};

如果这可以解决您的问题，请告诉我。

http://ui-grid.info/docs/#/tutorial

根据从另一个ui网格中选择的行加载一个ui网格

1 个答案: