保存更新到AngularFire $ firebaseArray服務我試圖弄清楚這一點,我覺得我已經嘗試了一切,以使其工作。從指令
我正在創建一個todo應用程序。我在服務中使用AngularFire。有一個項目指令是重複項目,每個項目都有一個複選框。當複選框被選中/取消選中時,它應該在DataService上調用一個方法,以在每次選中/取消選中時將項目對象{completed:false}更新爲{completed:true},反之亦然。 ngChange從一個對象數組中傳入單個對象(對象代表一個唯一的項目)。一切似乎工作,除了能夠保存更新後的項目複選框被選中/取消選中。我試過的所有東西都給出了這樣的錯誤:「無效的記錄;可以確定某個鍵的鍵」
在下面的屏幕截圖中,控制檯表示它更新對象,但在嘗試保存更新時引發錯誤進入Firebase。我試過的所有東西都給出了同樣的錯誤。我在這裏做錯了什麼?請看下面的代碼。我花了很長時間擺弄這個,所以任何幫助將不勝感激。如果任何事情沒有意義,請問我而不是downvoting,我真的想盡我所能解釋這一點,真的需要幫助。謝謝!
服務代碼:
var app = angular.module('dataService', ['firebase']);
app.factory('DataService', ["$firebaseArray",
function ($firebaseArray) {
//create, retrieve, update, destroy data from angularfire
var url = 'https://myFirebase.firebaseio.com/item';
var fireRef = new Firebase(url);
var factory = {};
factory.complete = function (data) {
var completeGoal = $firebaseArray(fireRef);
console.log("complete, fired in factory");
var itemID = data.$id;
console.debug("this item ID: " + itemID);
if(data.completed === true) {
console.log("this item data.completed: " + data.completed)
data.completed = false;
console.log("this item data.completed: is NOW " + data.completed)
}
else {
console.debug("this item data.completed: " + data.completed)
data.completed = true;
console.debug("this item data.completed: is NOW " + data.completed)
}
completeGoal.$save(itemID);
console.log(completeGoal.$save(itemID));
}
return factory;
}]);
指令代碼:
app.directive('item', function() {
return {
scope: {
item: '=set',
onClick: '&',
listType: '=',
complete: '='
},
controller: function() {},
controllerAs: 'ctrl',
bindToController: true,
transclude: true,
replace: true,
restrict: 'EA',
templateUrl: 'directives/items.html',
link: function(scope, elem, attrs) {
scope.$parent.onChange = function (data) {
scope.ctrl.complete(data);
}
//filter the items by type
var typeFilter = {type: scope.ctrl.listType}
scope.filterExpr = typeFilter;
}
}
});
項指令模板:
<div class="row goal-item" ng-repeat="item in ctrl.item | filter:filterExpr">
<div class="col-xs-12 col-sm-8 col-sm-offset-2">
<ul>
<li>
<label class="checkbox" ng-click="onChange(item)">
<input type="checkbox" class="goal-checkbox" ng-click="null" />
</label>
<span class="goal-title goal-completed">{{item.text}}</span>
</li>
</ul>
</div>
</div>
控制器:
app.controller('mainCtrl', ['$scope','DataService', function($scope, DataService) {
this.complete = DataService.complete;
}])