AngularJs UI Grid從Modal重新綁定

我有一個主控制器，在其中我將數據加載到「angular-ui-grid」，並使用引導模態窗體修改詳細數據，在修改的行模板中調用ng-dlbclick ：AngularJs UI Grid從Modal重新綁定

app.controller('MainController', function ($scope, $modal, $log, SubjectService) { 
    var vm = this;  
    gridDataBindings(); 

    //Function to load all records 
    function gridDataBindings() { 
     var subjectListGet = SubjectService.getSubjects(); //Call WebApi by a service 

     subjectListGet.then(function (result) { 
      $scope.resultData = result.data; 
     }, function (ex) { 
      $log.error('Subject GET error', ex); 
     }); 

    $scope.gridOptions = {     //grid definition 
     columnDefs: [ 
      { name: 'Id', field: 'Id' } 
     ], 
     data: 'resultData', 
     rowTemplate: "<div ng-dblclick=\"grid.appScope.editRow(grid,row)\" ng-repeat=\"(colRenderIndex, col) in colContainer.renderedColumns track by col.colDef.name\" class=\"ui-grid-cell\" ng-class=\"{ 'ui-grid-row-header-cell': col.isRowHeader }\" ui-grid-cell></div>" 
    }; 

    $scope.editRow = function (grid, row) {     //edit row 
     $modal.open({ 
      templateUrl: 'ngTemplate/SubjectDetail.aspx', 
      controller: 'RowEditCtrl', 
      controllerAs: 'vm', 
      windowClass: 'app-modal-window', 
      resolve: { 
       grid: function() { return grid; }, 
       row: function() { return row; } 
      } 
     }); 
    } 
});

在我執行插入/更新操作控制器「RowEditCtrl」和保存功能我想重新綁定插入/更新操作後的網格。這是代碼：

app.controller('RowEditCtrl', function ($modalInstance, $log, grid, row, SubjectService) { 
    var vm = this; 
    vm.entity = angular.copy(row.entity); 
    vm.save = save; 

    function save() { 
     if (vm.entity.Id === '-1') { 
      var promisePost = SubjectService.post(vm.entity); 
      promisePost.then(function (result) { 
       //GRID REBIND ?????  
      }, function (ex) { 
       $log.error("Subject POST error",ex); 
      }); 
     } 
     else { 
      var promisePut = SubjectService.put(vm.entity.Id, vm.entity); 
      promisePut.then(function (result) { 
       //row.entity = angular.extend(row.entity, vm.entity); 
       //CORRECT WAY? 
      }, function (ex) { 
       $log.error("Subject PUT error",ex); 
      }); 
     } 
     $modalInstance.close(row.entity); 
    } 
});

我試圖grid.refresh（）或grid.data.push（）但目前看來，在 '網格' 參數中的所有操作undefinied。

哪種方法可以從引導模式重新綁定/刷新ui-grid？

來源

2016-02-18 lpernice

到底在哪る嘗試刷新格？ – innovarerz

在'RowEditCtrl'控制器的保存功能中，在發佈或放置後的承諾中。 – lpernice

我終於解決了這種方式：

在RowEditCtrl

  var promisePost = SubjectService.post(vm.entity); 
      promisePost.then(function (result) {     
      vm.entity.Id = result.data; 
      row.entity = angular.extend(row.entity, vm.entity); 
      $modalInstance.close({ type: "insert", result: row.entity }); 
     }, function (ex) { 
      $log.error("Subject POST error",ex); 
     });

在MainController

modalInstance.result.then(function (opts) { 
     if (opts.type === "insert") { 
      $log.info("data push"); 
      $scope.resultData.push(opts.result); 
     } 
     else { 
      $log.info("not insert"); 
     } 

    });

來源

2016-02-19 15:59:36 lpernice

的電網裏面收到RowEditCtrl是不是引用，所以它不會幫助到RowEditCtrl內刷新。取而代之的是在您的主控制器中通過模態承諾解決後立即執行。這樣的：

var modalInstance = $modal.open({ ...}); 

modalInstance.result.then(function (result) { 
     grid.refresh() or grid.data.push() 
});

來源

2016-02-18 15:16:08 innovarerz

另一種選擇是將更新後的網格從RowEditCtrl作爲參數返回到MainController，就像你已經在$ modalInstance.close（grid）中做的那樣;並在MainController modalInstance.result.then（function（result）{... grid = result ...}）中提取它; – innovarerz

我試過你的方法，但grid.refresh或grid.data.push **總是未定義**。我也嘗試調用** gridDataBindings **函數，但似乎在函數結束之前會觸發模式承諾..'modalInstance.result.then（function（result）{ gridDataBindings（）; //$scope.gridOptions。 data.push（result）; }）;' – lpernice

AngularJs UI Grid從Modal重新綁定

回答

相關問題