角UI電網3.0 API

Question

我有註冊一個通用的網格和我的許多子網格的使用父服務：

angular.module('acme.services.grid', [ 
    'ui.grid', 
    'ui.grid.selection' 
]) 

    .factory('acmeGrid', function (uiGridConstants, $translate, $mdToast) { 

     var UIGrid = function() { 
      var grid = {}, 
       api, 
       eventsCallbackQueue = {}, 
       selectedRows = {}, 
       loadCallback, 
       syncCallback; 

      grid.loading = false; 
      grid.enableSorting = true; 
      grid.enableHorizontalScrollbar = uiGridConstants.scrollbars.NEVER; 
      grid.enableMinHeightCheck = false; 
      grid.enableRowSelection = true; 
      grid.enableRowHeaderSelection = false; 
      grid.multiSelect = false; 
      grid.modifierKeysToMultiSelect = false; 
      grid.noUnselect = false; 
      grid.onRegisterApi = function (gridApi) { 
       api = gridApi; 

       selectedRows = api.selection.getSelectedRows(); 

       // apply user callbacks 
       angular.forEach(eventsCallbackQueue, function (queue, event) { 
        var parts = event.split('.'); 
        // invalid callback 
        if (2 < parts.length) { 
         return; 
        } 

        angular.forEach(queue, function (data) { 
         api[parts[0]].on[parts[1]](data.scope, data.func); 
        }); 

       }); 
      }; 

      grid.columnDefs = []; 

      function setSyncCallback(func) { 
       syncCallback = func; 
      } 

      function setLoadCallback(func) { 
       loadCallback = func; 
      } 

      function resize() { 
       return api.core.handleWindowResize(); 
      } 

      function sync() { 
       return syncCallback(); 
      } 

      function load() { 
       grid.loading = true; 
       return loadCallback() 
        .then(onLoadSuccess, onLoadError); 
      } 

      function translate(path) { 
       /** 
       * translate grid titles (see why using the $filter('translate')('str') 
       * fails to translate in sync mode) while in the ronin.orders application it works 
       */ 
       angular.forEach(grid.columnDefs, function (col) { 
        $translate(path + '.' + col.displayName) 
         .then(function onTranslate(s) { 
          col.displayName = s; 
         }); 
       }); 
      } 

      function toast(message, type) { 
       type = type || 'primary'; 

       // mdToast show only one toast, 
       // so for now display only first error message 
       if (angular.isArray(message)) { 
        message = message[0]; 
       } 

       return $mdToast.show({ 
        template: '<md-toast class="md-toast md-toast-"' + type + '>' + message + '</md-toast>', 
        hideDelay: 3000, 
        position: 'bottom right' 
       }); 
      } 

      function onLoadSuccess(response) { 
       grid.loading = false; 
       grid.data = response; 
      } 

      function onLoadError(errors) { 
       toast(errors, 'error'); 
      } 

      function getApi() { 
       // don't know why, cannot retrieve it by reference 
       // so just use an accessor 
       return api; 
      } 

      // expose ui-grid events with the following name: 
      // _API_._EVENT_ 
      // eg.: "api.selection.on.rowSelectionChanged" becomes "selection.rowSelectionChanged" 
      function on(event, $scope, func) { 

       if (!eventsCallbackQueue.hasOwnProperty(event)) { 
        eventsCallbackQueue[event] = []; 
       } 

       eventsCallbackQueue[event].push({scope: $scope, func: func}); 
      } 

      return { 
       api: api, 
       grid: grid, 
       load: load, 
       sync: sync, 
       selectedRows: selectedRows, 
       translate: translate, 
       setLoadCallback: setLoadCallback, 
       setSyncCallback: setSyncCallback, 
       resize: resize, 
       on: on 
      }; 
     }; 

     return { 
      getInstance: function() { 
       return new UIGrid(); 
      } 
     }; 
    }); 

我與api想到一個問題，我不瞭解它的行爲：

var grid = {}, 
api; 

grid.onRegisterApi = function (gridApi) { 
    api = gridApi; 
} 

// this doesn't work, I get undefined or Object{} dpending on my initialization 
return { 
    api: api 
} 

// this works 
return { 
    api: function() { return api; } 
}; 

如何來的第一回沒有作品，api的對象不應該是被引用onRegisterApi回調過程中更新？

Answer 1

嘗試在返回路徑之前添加一些日誌記錄。我保證您的onRegisterApi處理程序在工廠的退貨聲明後正在運行。

UI-Grid的API註冊是異步和延遲的，因此您需要在將它傳回備份鏈時考慮這一點。您始終可以使用承諾來檢索對API實例的引用。