angularjs - 将 ng-grid 与 angularFire 一起使用 - 关键命名问题

Question

我现在已经对此进行了一些尝试，但无法理解它:

(使用 Angular 1.2.2、AngularFire 0.5.0 和最新的 ng-grid)

所以我有一个 firebase，我正在使用 angularFire 将数据提取到 ng-grid 组件中，如下所示:

//First I go get my data, in this case something called 'grades' from ..../db/grades
    var promise = angularFire(new Firebase($scope.fireBaseUrl), $scope, 'grades');
//When they're fetched I start up a watcher
    promise.then(function(grades) {
    startWatchGrade($scope, filterFilter, appSettings);
});

//Then I bind that grades as a datasource to my ng-grid
$scope.gridOptions = { 
data: 'grades',
enableCellSelection: false,
enableRowSelection: true,
etc....,

效果很好，我已经完成了将新项目添加到“等级”(推送)和删除项目(拼接)的控件，并且所有内容都很好地反射(reflect)到 ng-grid 中。就像这样:

//Adding new like this is ok
$scope.grades.push({some-new-data-here});

//Deleting old like this is ok
$scope.grades.splice(row.rowIndex, 1);

但是这种方法会自动生成基于 int 的 firebase 键，这些键在修改时会一直变化，因此我想控制这些键，因此我更改了添加要使用的项目:

var fbRef = new Firebase($scope.fireBaseUrl);
var newRef = fbRef.push({some-items-here});

一切正常，使用我的非整数 ID 将数据存储到 firebase 中，但它不再绑定(bind)到 ng-grid 。将“成绩”转储到控制台会显示返回的所有行，但不会显示在 ng-grid 中。

简而言之:由 angularFire 生成的基于整数的索引在 ng-grid 中可以正常工作，而由 firebase.push 创建的自定义字母数字则不行。

我希望这听起来不太神秘。想过做一个 fiddle ，但我们希望这是我忽略的一些“陷阱”并且很容易解决。如果没有的话我会尝试修补一个。

谢谢!

Answer 1

根据 documentation ， $firebase 总是返回对象，而不是数组，这与 ng-grid 配合得不太好。在这种情况下，AngularFire提供了一个过滤器来帮忙，orderByPriority。确保将 $filter 注入(inject)您的 Controller 。

(注意:我没有使用 Promise 或 Watchers，仅使用 AngularFire 的内置事件)

$scope.grades = $firebase(new Firebase($scope.fireBaseUrl));
$scope.gradesData=[];
$scope.gridOptions = { data: 'gradesData'}
$scope.grades.$on("loaded", function(data) {
    var arrData = $filter("orderByPriority")(data);
    $scope.$apply(function(){$scope.gradesData = arrData;});
});

您可以对 $on.('change'...) 尝试类似的方法来创建新行。

希望有帮助