2013-08-08 17 views
5

Il controller sotto alimenta una vista con una tabella e un modulo. La parte rilevante della tabella è:AngularFire non aggiorna il Firebase a volte

<tr ng-repeat="obj in tab.col | filter:filterObj" ng-click="select(obj)" ng-class="isSelected(obj)">

Se una riga viene cliccato, il modulo visualizza i dettagli della obj (il suo modello è tab.obj), ed è possibile modificarlo. La tabella ottiene l'aggiornamento appropriatamente quando l'utente modifica un oggetto nei campi del modulo, ma Firebase non riceve aggiornamenti ma aggiunte di nuovi oggetti (questo viene fatto con un array.push (obj)).

define(['app'], function(app) { 
app.controller('LinksCtrl',['$scope', '$filter', '$http','angularFire','angularFireAuth', function($scope,$filter,$http, angularFire, angularFireAuth) { 
$scope.links = {}; 
$scope.tabs = []; 

var url = "https://<url>.firebaseio.com/links"; 
angularFireAuth.initialize(url, {scope: $scope, name: "user", path: "/"}); 
var promise = angularFire(url, $scope, 'links', {}) 

$scope.select = function (item) { 
    for(i in $scope.tabs) { 
    var tab = $scope.tabs[i]; 
    if (tab.active) { 
     tab.obj = item; 
     if (tab.obj.selected) { 
     tab.obj.selected = ! tab.obj.selected; 
     } else { 
     tab.obj.selected = true; 
     // $scope.$apply(); 
     } 
    } 
    } 
}; 

$scope.isSelected = function(obj) { 
    if (obj.selected && obj.selected === true) { 
    return "active"; 
    } 
    return ""; 
} 


promise.then(function() { 

    $scope.tabs.push({ 
    title: 'links', 
    disabled: false, 
    active: false, 
    col: $scope.links.open, //this is an array of objects 
    obj: {} 
    }); 

    $scope.tabs[0].active = true; 

    for(i in $scope.tabs) { 
    var tab = $scope.tabs[i]; 
    tab.actions = app.actions(); 

    // app.actions returns an array with more objects like the following doing CRUD and other basic stuff 
    tab.actions.push({ 
     name: 'Delete link', 
     icon: 'icon-minus', 
     cond: function(tab) { if ('selected' in tab.obj) { return tab.obj.selected}; return false; }, 
     func: function(tab) { 
     // splice tab.col or whatever modification 
     } 
    }); 
    }; 
}); 
    }]); 

}); 

Come posso far funzionare qualcosa del genere? dovrebbe passare alla sincronizzazione manuale tramite le raccolte? il debug con console.log mostra che l'oggetto obj ha ciò che dovrebbe avere in tutte le fasi del codice (ha il prototipo, l'hashcode, ecc.), è solo che il firebase non riceve gli aggiornamenti.

Aggiornamento:

ho una soluzione che funziona. Sembra che sia un problema vincolante, o qualcosa del genere, ma non sono sicuro di cosa stia succedendo. L'assegnazione di schede [i] = $ .col scope.links.i si presenta come il colpevole (in questo caso i = 'aperto': -. ?. Potrebbe essere il mio utilizzo di angolare

controller scope ------ 

    // get the firebase data and store it in 
    var promise = angularFire(url, $scope, 'links', {}) 

    // build the tabs structure, where tabs[i].col = $scope.links.i 

    // build actions for each tab 

    // create an empty tabs[i].obj to use in the form model 

ng-repeat scope ------- 

    // iterate over the tab structure 
    <tab ng-repeat="tab in tabs" heading="{{tab.title}}" active="tab.active" disabled="tab.disabled"> 

ng-repeat scope -------- 

    // Iterate over the elements, so we can select one, and edit it, updating firebase 
    // If we iterate over tab.col, firebase does not get the updates, but If we iterate over 
    // the original $scope.links variable, it works as expected 

    <tr ng-repeat="obj in links[tab.title] | filter:filterObj | orderBy: 'date':true" ng-click="select(obj)" ng-class="isSelected(obj)"> 
+0

Questo sembra essere un problema vincolante data la danza degli ambiti di due ripetizioni nid nidificate nella vista. Ma tutti gli elementi sono oggetti e dovrebbero funzionare: -? [link] (https://github.com/angular/angular.js/wiki/Understanding-Scopes) –

+0

Grattini alla ricerca di una soluzione! Puoi copiare la tua soluzione in una risposta qui sotto? Rende più facile per i futuri utenti trovarlo :) – mimming

risposta

1

ho una soluzione che funziona.Sembra che sia un problema vincolante da parte mia.L'assegnazione delle schede [i] .col = $ scope.links.i sembra il colpevole (in questo caso i = 'open': - ?. Potrebbe essere mio utilizzo di angolare.

La soluzione è invece di utilizzare schede [i] .col, uso $ scope.links, cioè utilizzare una variabile $ portata anziché un riferimento a una variabile $ portata.

controller scope ------ 

    // get the firebase data and store it in 
    var promise = angularFire(url, $scope, 'links', {}) 

    // build the tabs structure, where tabs[i].col = $scope.links.i 

    // build actions for each tab 

    // create an empty tabs[i].obj to use in the form model 

ng-repeat scope ------- 

    // iterate over the tab structure 
    <tab ng-repeat="tab in tabs" heading="{{tab.title}}" active="tab.active" disabled="tab.disabled"> 

ng-repeat scope -------- 

    // Iterate over the elements, so we can select one, and edit it, updating firebase 
    // If we iterate over tab.col, firebase does not get the updates, but If we iterate over 
    // the original $scope.links variable, it works as expected 

    <tr ng-repeat="obj in links[tab.title] | filter:filterObj | orderBy: 'date':true" ng-click="select(obj)" ng-class="isSelected(obj)"> 
Problemi correlati