Question

我是angularjs的新手，正在和firebase一起玩。我跟着 angularFire tutorial用于隐式同步。

我的控制器代码是

trankeeloManagerApp.controller('StoresCtrl', [
    'NavService', '$scope', 'angularFire',
    function(NavService, $scope, angularFire) {
  NavService.updateActiveNav();

  var url = '[MY_URL]/users/test_user/stores';
  $scope.stores = angularFire(url, $scope, 'stores', []);
  $scope.store = {
    name: '',
    tin: '',
    description: ''
  };

  $scope.page = {
    show_list_loading : true,
    show_list_table : false,
    show_list : true,
    show_add_item : false,
    show_add_button : false,
  };

  $scope.stores.then(function(stores) {
    $scope.hideList();
    console.log(stores);

    $('#datatables').dataTable( {
        "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'span6'i><'span6'p>>",
        "sPaginationType": "bootstrap",
        "oLanguage": {
                "sLengthMenu": "_MENU_ records per page"
        },
        "aaData" : $scope.stores,
        "aoColumns": [
          { "sTitle": "Name",   "mData": "name", "mDataProp" : "name" },
          { "sTitle": "TIN",  "mData": "tin", "mDataProp" : "tin" },
          { "sTitle": "Description", "mData": "description", "mDataProp" : "description" }
        ]
    });
    $scope.page.show_add_button = true;
    $scope.addStore = function(){
      $scope.showList();
      $scope.stores.push($scope.store);
      addStoreInDatatable($scope.store);
      $scope.store = {
        name: '',
        tin: '',
        description: ''
      };
    };

    $scope.removeStore = function (store) {
      $scope.stores.splice($scope.stores.indexOf(store), 1);
    };

    //TODO implement edit
  });

  $scope.showAddStore = function(){
    $scope.page.show_add_item = true;
    $scope.page.show_list = false;
  }

  $scope.cancelAddStore = function(){
    $scope.hideList();
  }

  $scope.showList = function(){
    $scope.page.show_add_item = false;
    $scope.page.show_list = true;
  };

  $scope.hideList = function(){
    $scope.page.show_list_loading = false;
    $scope.page.show_list_table = true;
  };

  function addStoreInDatatable(store){
    $('#datatables').dataTable().fnAddData({
      "name" : store.name,
      "tin" : store.tin,
      "description" : store.description 
    });
  };

  $scope.showList();

}]);

第一次加载时一切运行良好，但是当我去另一个控制器并返回时。我收到了这个错误。

TypeError：无法调用未定义的方法'然后'

Answer 1

遇到同样的行为我认为当前是angularFire.js中的bug：

如果请求的值已在本地缓存，则angularFire()会返回undefined而不是（已解决的）承诺。

更新：该错误现在是fixed。

关于你对$scope.stores.push的后续调用的问题：我建议区分绑定值（在第3个arg和angularFire（）中命名）和绑定的promise（由angularFire（）返回）：

$scope.promise = angularFire(url, $scope, 'stores', []);
$scope.promise.then (function () {
    $scope.stores = { foo: 'bar', ... };
});

第二次加载控制器时，angularFire（）返回undefined

1 个答案: