ng-repeat, основанный на вложенных элементах

Question

Основываясь на данных ниже и предполагая, что количество автомобилей и больше идентификаторов пользователя firebase связаны с конкретными автомобилями. Как бы я ng-повторить только данные автомобиля, которые соответствуют текущему пользователю. Пример: если бы я был подписан и мой Firebase.uid был simplelogin: 26, как бы я мог повторить данные автомобиля, в которых был мой Firebase.uid? Поэтому в этом случае будет отображаться только Honda.

Я читал, что способ организации данных Firebase действительно важен, поэтому я не уверен, что это идеально отформатировано, в любом случае я хотел бы знать, возможно ли это так, как оно в настоящее время отформатировано. Я все еще изучаю все это и не могу понять этого. Любое понимание было бы здорово, спасибо!

HTML

<h1>MyCars</h1> 
    <ul> 
    <li ng-repeat="car in cars">  
     <p>Make: {{ car.type }}</p> 
     <p>Year: {{ car.year }}</p> 
     <p>color: {{ car.color }}</p> 
    </li> 
    </ul> 

JSON

"cars": { 
    "-JRHTHaIs-jNPLXOQivY": { 
     "type": "Honda", 
     "year": "2008", 
     "color":"red", 
     "simplelogin:26": { 
     "name":"ted" 
    }, 
     "simplelogin:32": { 
     "name":"ted" 
     } 
    }, 
    "-JRHTHaKuITFIhnj02kE": { 
     "type": "Chevy", 
     "year": "2006", 
     "color":"white", 
     "simplelogin:16": { 
     "name":"ted" 
    } 
    } 
} 

Answer 1

Это не является идеальным данных состав. Если машины действительно есть 1: отношения 1 с пользователями, как следует из данных, то нужно просто хранить их пользователем, а затем запросить этот конкретный идентификатор пользователя:

{ 
    "cars": { 
     "ted": { 
     ... 
     } 
    } 
} 

Теперь запрашивая автомобили пользователя чрезвычайно прост:

var ref = new Firebase("https://<YOUR-FIREBASE-APP>.firebaseio.com/"); 
$scope.cars = $firebaseArray(ref.child('cars/<USER ID>')); 

Если автомобили не могут быть разделены пользователем, потому что они имеют п: 1 отношения, то a query может обеспечить такую ​​же функциональность (убедитесь, что вы index them on the server):

var ref = new Firebase("https://<YOUR-FIREBASE-APP>.firebaseio.com/"); 
var query = ref.child('cars').orderByChild('name').equalTo('ted'); 
$scope.cars = $firebaseArray(query); 

Если вы хотите иметь N: N отношения, то индексировать пользователей к автомобилям более уместно:

"cars": { 
    "-JRHTHaIs-jNPLXOQivY": { 
     "type": "Honda", 
     "year": "2008", 
     "color":"red" 
    }, 
    ... 
}, 

"owners": { 
    "ted": { 
     "-JRHTHaIs-jNPLXOQivY": true, 
     ... 
    } 
} 

Получение автомобилей для данного пользователя теперь немного сложнее, но все же не лишено смысла:

angular.factory('CachedCarList', function() { 
    // a simple cache of Firebase objects looked up by key 
    // in this case, a list of cars that have an n:n relationship to users 
    var carsRef = new Firebase("https://<YOUR-FIREBASE-APP>.firebaseio.com/cars"); 
    var carsLoaded = {}; 

    return { 
    get: function(carId) { 
     if(!carsLoaded.hasOwnProperty(carId)) { 
     carsLoaded[cardId] = $firebaseObject(carsRef.child(carId)); 
     } 
     return carsLoaded[carId]; 
    }, 
    destroy: function(carId) { 
     angular.forEach(carsLoaded, function(car) { 
     car.$destroy(); 
     }); 
     carsLoaded = {}; 
    } 
    } 
}); 

angular.factory('CarList', function($firebaseArray, CachedCarList) { 
    var ref = new Firebase("https://<YOUR-FIREBASE-APP>.firebaseio.com/"); 

    var CarsIndexed = $firebaseArray.$extend({ 
    '$$added': function(snapshot) { 
     // when something is added to the index, synchronize the actual car data 
     // we use the $loaded promise because returning it here will make AngularFire 
     // wait for that data to load before triggering added events and Angular's compiler 
     return CachedCarList.get(snapshot.key()).$loaded(); 
    }, 

    '$$updated': function(snapshot) { 
     return false; // our cars update themselves, nothing to do here 
    } 
    }); 

    return function(userId) { 
     // when a list of cars is requested for a specific user, we return an CarsIndexed 
     // than synchronizes on the index, and then loads specific cars by referencing their 
     // data individually 
     return new CarsIndexed(ref.child('owners/'+userId)); 
    } 
}); 

И firebase-util's NormalizedCollection может помочь сделать этот процесс намного проще:

angular.factory('CarList', function($firebaseArray) { 
    var ref = new Firebase("https://<YOUR-FIREBASE-APP>.firebaseio.com/"); 
    return function(userId) { 
    var nc new Firebase.util.NormalizedCollection(
     ref.child('owners/' + userId), 
     ref.child('cars') 
    ).select('cars.type', 'cars.year', 'cars.color') 
    return $firebaseArray(nc.ref()); 
    } 
}); 

Firebase Angular guide охватывает многие таких как этот, а также вводит библиотеку привязок для обработки синхронизации удаленных/локальных данных от вашего имени.

Кроме того, многие документы, такие как структуры данных, индексирование отношений «многие-к-одному» или «многие ко многим» и т. Д., Рассматриваются в документах Firebase. Я настоятельно рекомендую прочитать the guide спереди назад, прежде чем идти дальше.

Answer 2

Вы можете перебрать свойства на объекте в ng-repeat с использованием синтаксиса ng-repeat="(key, value) in data"

<ul> 
    <li ng-repeat="(key, value) in cars"> 
     <p>Make: {{ value.type }}</p> 
     <p>Year: {{ value.year }}</p> 
     <p>color: {{ value.color }}</p> 
    </li> 
</ul>