Angular - test moteur recherche
by yinyann
HTML
<div ng-app="myGamesApp">
<div ng-controller="FiltersCtrl">
<select ng-model="filterService.activeFilters.mecaniques">
<option ng-repeat="mecaniques in ['DeckBuilding','Pose d ouvriers']">{{mecaniques}}</option>
</select>
<label ng-repeat="nbjoueurs in [1, 2, 3, 4, 5, 6, 7, 8, '']">
<input
type="radio"
name="nbjoueurs[]"
ng-click="toggleSelection(nbjoueurs)"
> {{nbjoueurs}}
</label>
</div>
<div ng-controller="GameListCtrl">
<p><input ng-model="filterService.activeFilters.name" /></p>
<ul>
<li ng-repeat="game in games | filter: filterService.activeFilters">
{{game.name}}
<p>{{game.mecaniques[0]}}</p>
</li>
</ul>
</div>
</div>
JavaScript
angular.module('myGamesApp.services', []).factory('filterService', function(){
return {
activeFilters: {},
searchText: ''
};
});
var myGamesApp = angular.module('myGamesApp', ['myGamesApp.services']);
myGamesApp.controller('FiltersCtrl', function ($scope, filterService){
$scope.filterService = filterService;
$scope.toggleSelection = function toggleSelection(nbJoueurs) {
var idx = $scope.filterService.activeFilters.joueurs = nbJoueurs;
};
});
myGamesApp.controller('GameListCtrl', function ($scope, filterService) {
$scope.filterService = filterService;
$scope.games = [
{
'name': 'Ascension',
'mecaniques': ["DeckBuilding"],
'joueurs' : [1,2,3,4,5,6]
},
{
'name': 'Tzolkin',
'mecaniques': ["Pose d ouvriers"],
'joueurs': [2,3,4]
},
];
});