-
```
diff --git a/javascript/angular/directives-4.md b/javascript/angular/directives-4.md
index c9b6444..0e4b034 100644
--- a/javascript/angular/directives-4.md
+++ b/javascript/angular/directives-4.md
@@ -1,19 +1,20 @@
-# .cadoles-slide-title[Les directives de base (4/6)]
+# .cadoles-slide-title[Les directives de base (4/5)]
-**Conditions dans les templates: `ng-show`, `ng-hide`, `ng-switch`**
+**Modification dynamique du style: `ng-class`**
```html
-
-
Caché !
-
Affiché !
+
+
-
- Affiché !
- Caché !
- Caché !
-
+
Rouge et large
+
+
Bleu
diff --git a/javascript/angular/directives-5.md b/javascript/angular/directives-5.md
index 362479d..8ea095a 100644
--- a/javascript/angular/directives-5.md
+++ b/javascript/angular/directives-5.md
@@ -1,23 +1,26 @@
-# .cadoles-slide-title[Les directives de base (5/6)]
+# .cadoles-slide-title[Les directives de base (5/5)]
+
+**Inclusion de template avec la directive `ng-include`**
-**Modification dynamique du style: `ng-class`**
```html
+
+
+
-
-
-
-
-
- Rouge et large
-
- Bleu
-
-
+
+
+
+
+
+
```
+
+- Les templates peuvent être chargés dynamiquement, à la volée.
+- Il est possible de les précompiler et de les inclures sous leur forme Javascript lors de la mise en production
diff --git a/javascript/angular/directives-6.md b/javascript/angular/directives-6.md
deleted file mode 100644
index ba1e314..0000000
--- a/javascript/angular/directives-6.md
+++ /dev/null
@@ -1,26 +0,0 @@
-# .cadoles-slide-title[Les directives de base (6/6)]
-
-**Inclusion de template avec la directive `ng-include`**
-
-```html
-
-
-
-
-
-
-
-
-
-
-
-
-
-```
-
-- Les templates peuvent être chargés dynamiquement, à la volée.
-- Il est possible de les précompiler et de les inclures sous leur forme Javascript lors de la mise en production
diff --git a/javascript/angular/exercices/filtres-1/.solution/app.js b/javascript/angular/exercices/filtres-1/.solution/app.js
new file mode 100644
index 0000000..32a84de
--- /dev/null
+++ b/javascript/angular/exercices/filtres-1/.solution/app.js
@@ -0,0 +1,58 @@
+/*
+ * Énoncé:
+ *
+ * 1. Modifier le template de index.html afin de modifier l'affichage des commits
+ * dans la table HTML en utilisant les filtres de base d'Angular.
+ *
+ * Contraintes d'affichage:
+ * - La date du commit devra être affiché au format "dd-mm-yyyy"
+ * - L'afichage du SHA du commit devra être limité à 10 caractères
+ *
+ * ! Pas besoin de modifier le code de app.js !
+ *
+ * 2. Mettre en place les directives et le filtre nécessaire afin d'implémenter
+ * un champ de recherche permettant de filtrer la liste des commits.
+ *
+ * Indice:
+ * - Filtre "filter": https://code.angularjs.org/1.3.15/docs/api/ng/filter/filter
+ *
+ * ! Pas besoin de modifier le code de app.js !
+ *
+ * 3. Implémenter un filtre qui "met en lumière" (change la couleur du fond du texte) les éléments
+ * correspondants à la recherche dans le message de commit.
+ *
+ * Exemple d'usage attendu: {{ 'my text' | highlight:'my' }}
+ *
+ * Indices:
+ * - Le filtre devra rechercher le texte voulu et le remplacer par un fragment de HTML
+ * - Nécessite l'usage du service $sce dans le filtre et de sa méthode $sce.trustAsHtml() https://docs.angularjs.org/api/ngSanitize
+ * - Nécessite également l'utilisation de la directive ng-bind-html plutot que l'utilisation des {{ ... }} https://docs.angularjs.org/api/ng/directive/ngBindHtml
+ *
+ */
+
+var Exo = angular.module('Exo', []);
+
+Exo.controller('MainCtrl', ['$scope', '$http', function($scope, $http) {
+
+ $scope.commits = [];
+
+ $http.get('https://api.github.com/repos/torvalds/linux/commits')
+ .then(function(res) {
+ $scope.commits = res.data;
+ })
+ ;
+
+}]);
+
+Exo.filter('highlight', ['$sce', function($sce) {
+
+ return function(input, needle) {
+
+ if( !angular.isString(input) ) return input;
+
+ var html = '
'+needle+'';
+ return $sce.trustAsHtml(input.replace(needle, html));
+
+ };
+
+}]);
diff --git a/javascript/angular/exercices/filtres-1/.solution/index.html b/javascript/angular/exercices/filtres-1/.solution/index.html
new file mode 100644
index 0000000..2222866
--- /dev/null
+++ b/javascript/angular/exercices/filtres-1/.solution/index.html
@@ -0,0 +1,46 @@
+
+
+
+
Exercice: Utilisation des filtres
+
+
+
+
+
+
+
Commits du dépôt torvalds/linux sur Github
+
+
+
+
+
+
+
+
+
+
diff --git a/javascript/angular/exercices/filtres-1/app.js b/javascript/angular/exercices/filtres-1/app.js
new file mode 100644
index 0000000..024cdc7
--- /dev/null
+++ b/javascript/angular/exercices/filtres-1/app.js
@@ -0,0 +1,46 @@
+/*
+ * Énoncé:
+ *
+ * 1. Modifier le template de index.html afin de modifier l'affichage des commits
+ * dans la table HTML en utilisant les filtres de base d'Angular.
+ *
+ * Contraintes d'affichage:
+ * - La date du commit devra être affiché au format "dd-mm-yyyy"
+ * - L'afichage du SHA du commit devra être limité à 10 caractères
+ *
+ * ! Pas besoin de modifier le code de app.js !
+ *
+ * 2. Mettre en place les directives et le filtre nécessaire afin d'implémenter
+ * un champ de recherche permettant de filtrer la liste des commits.
+ *
+ * Indice:
+ * - Filtre "filter": https://code.angularjs.org/1.3.15/docs/api/ng/filter/filter
+ *
+ * ! Pas besoin de modifier le code de app.js !
+ *
+ * 3. Implémenter un filtre qui "met en lumière" (change la couleur du fond du texte) les éléments
+ * correspondants à la recherche dans le message de commit.
+ *
+ * Exemple d'usage attendu: {{ 'my text' | highlight:'my' }}
+ *
+ * Indices:
+ * - Le filtre devra rechercher le texte voulu et le remplacer par un fragment de HTML
+ * - Nécessite l'usage du service $sce dans le filtre et de sa méthode $sce.trustAsHtml(), voir https://docs.angularjs.org/api/ngSanitize
+ * - Nécessite également l'utilisation de la directive "ng-bind-html" plutot que l'utilisation des {{ ... }} pour l'affichage du message, voir https://docs.angularjs.org/api/ng/directive/ngBindHtml
+ *
+ */
+
+
+var Exo = angular.module('Exo', []);
+
+Exo.controller('MainCtrl', ['$scope', '$http', function($scope, $http) {
+
+ $scope.commits = [];
+
+ $http.get('https://api.github.com/repos/torvalds/linux/commits')
+ .then(function(res) {
+ $scope.commits = res.data;
+ })
+ ;
+
+}]);
diff --git a/javascript/angular/exercices/filtres-1/index.html b/javascript/angular/exercices/filtres-1/index.html
new file mode 100644
index 0000000..5114709
--- /dev/null
+++ b/javascript/angular/exercices/filtres-1/index.html
@@ -0,0 +1,46 @@
+
+
+
+
Exercice: Utilisation des filtres
+
+
+
+
+
+
+
Commits du dépôt torvalds/linux sur Github
+
+
+
+
+
+
+
+
+
+
diff --git a/javascript/angular/filtres-1.md b/javascript/angular/filtres-1.md
new file mode 100644
index 0000000..9d4e690
--- /dev/null
+++ b/javascript/angular/filtres-1.md
@@ -0,0 +1,22 @@
+# .cadoles-slide-title[Les filtres (1/)]
+
+- Les filtres permettent de formatter le résultat d'une expression afin de l'afficher à l'utilisateur.
+- Ils peuvent être utilisés dans les templates, dans les contrôleurs ou dans les services.
+- Angular fournit une liste de [filtres par défaut](https://code.angularjs.org/1.3.15/docs/api/ng/filter), mais il est possible également de créer ses propres filtres.
+
+**Usage d'un filtre dans les expressions**
+```html
+
+
+
+
+ {{ myStr | uppercase }}
+
+
+ {{ myStr | uppercase | lowercase }}
+
+
+ {{ myArr | limitTo:2 }}
+
+
+```
diff --git a/javascript/angular/filtres-2.md b/javascript/angular/filtres-2.md
new file mode 100644
index 0000000..9da2c69
--- /dev/null
+++ b/javascript/angular/filtres-2.md
@@ -0,0 +1,16 @@
+# .cadoles-slide-title[Les filtres (2/)]
+
+**Exemple d'usage dans un contrôleur**
+```js
+angular.module('myApp', [])
+ .controller('MyCtrl', ['$scope', '$filter', function($scope, $filter) {
+
+ var myArr = ['item 1', 'item 2', 'item 3'];
+
+ // Usage: result = $filter(filterId, input, arg1, arg2, ...);
+
+ console.log( $filter('limitTo', myArr, 2) ); // -> ['item 1', 'item 2']
+
+ }])
+;
+```
diff --git a/javascript/angular/filtres-3.md b/javascript/angular/filtres-3.md
new file mode 100644
index 0000000..36d2b1a
--- /dev/null
+++ b/javascript/angular/filtres-3.md
@@ -0,0 +1,32 @@
+# .cadoles-slide-title[Les filtres (3/)]
+
+**Création d'un filtre personnalisé**
+```js
+// Création du filtre
+angular.module('myApp', []).filter('join', function() {
+
+ // Fonction de formatage
+ return function(input, separator) {
+
+ // Utilisation d'une valeur par défaut si le séparateur n'est pas défini
+ separator = separator || ',';
+
+ // Si l'entrée n'est pas un tableau, on retourne celle ci sans modification
+ if( !angular.isArray(input) ) return input;
+
+ // On retourne le tableau sous la forme d'une chaine de caractères,
+ // ses éléments joints par le séparateur
+ return input.join(separator);
+
+ };
+
+});
+```
+**Usage**
+```html
+
+
+ {{ myArr | join:'/' }}
+
+
+```
diff --git a/javascript/angular/fin.md b/javascript/angular/fin.md
deleted file mode 100644
index d3c32ce..0000000
--- a/javascript/angular/fin.md
+++ /dev/null
@@ -1,7 +0,0 @@
-# .cadoles-slide-title[Fin]
-
-.cadoles-center[
-
-# Fin de la première partie
-
-]
diff --git a/javascript/angular/index.html b/javascript/angular/index.html
index 3eb2443..8ee1838 100644
--- a/javascript/angular/index.html
+++ b/javascript/angular/index.html
@@ -28,8 +28,11 @@
'directives-3',
'directives-4',
'directives-5',
- 'directives-6',
- 'fin'
+ 'filtres-1',
+ 'filtres-2',
+ 'filtres-3',
+ 'questions',
+ 'licence'
];
diff --git a/javascript/angular/plan.md b/javascript/angular/plan.md
index 2990f99..f4369dc 100644
--- a/javascript/angular/plan.md
+++ b/javascript/angular/plan.md
@@ -8,10 +8,10 @@
- Contrôleurs et scopes
- Services et injection de dépendances
- Les directives de base
-- Routage avec le module `ngRoute`
- Les filtres
- Création de directives
- Animations
+- Routage avec le module `ngRoute`
- Organisation d'un projet
- Tests unitaires
- Tests fonctionnels
diff --git a/javascript/angular/scope-1.md b/javascript/angular/scope-1.md
index b3409e9..c1710ca 100644
--- a/javascript/angular/scope-1.md
+++ b/javascript/angular/scope-1.md
@@ -22,7 +22,7 @@