Avez-vous déjà eu besoin d'utiliser plusieurs fois la même collection dans votre vue afin de réaliser différents traitements sur celle-ci ? Voici le moyen de réaliser cette opération.
Exemple type
Vous disposez de la collection "user" et vous voulez afficher une liste d'utilisateurs hommes et une liste d'utilisateurs femmes dans la même vue.
user.xml
<Alloy>
<Collection src="user" instance="true" id="userMan" />
<Collection src="user" instance="true" id="userWoman" />
<View id="man" layout="horizontal" dataCollection="$.userMan" dataFilter="filterMan">
<Label text="{name}"/>
</View>
<View id="man" layout="horizontal" dataCollection="$.userWoman" dataFilter="filterWoman">
<Label text="{name}"/>
</View>
</Alloy>NOTE : J'utilise ici Alloy
user.js
//fetch data to view
$.userMan.fetch();
$.userWoman.fetch();
function filterMan(collection) {
return collection.where({
type: 'Man'
});
}
function filterWoman(collection) {
return collection.where({
type: 'Woman'
});
}Comment cela marche-t-il ?
Décortiquons l'élément <Collection />.
C'est l'attribut instance="true" qui réalise toute la magie. En passant à true cet attribut nous créons une instance de notre collection user. Et en créant différentes instances de la même collection, nous pouvons les manipuler chacune indépendamment de l'autre grâce à l'attribut id.
Ainsi dans la vue ou le contrôleur il suffit de référencer la collection souhaitée avec $. suivit de son id. $.userMan par exemple.
