Base formation angular+amélioration layout formations JS

2015-04-06 17:50:08 +02:00
parent 60d10200f7
commit 7cbddf946d
29 changed files with 800 additions and 25 deletions
--- a/javascript/angular/app-basique.md
+++ b/javascript/angular/app-basique.md
@ -0,0 +1,36 @@
+# .cadoles-slide-title[Premier coup d'oeil]
+
+**Une application basique**
+
+```html
+<html>
+  <head>
+    <meta charset="utf8">
+    <title>Calculateur de diamètre et périmètre d'un cercle</title>
+  </head>
+  <!-- Déclaration du point d'entrée et initialisation de l'application -->
+  <body ng-app ng-init="radius=1.0; pi=3.14">
+
+  <h1>Calculateur de diamètre et périmètre d'un cercle</h1>
+
+  <!-- Liaison de données via la directive ng-model -->
+  <label>Approximation de π:</label>
+  <input ng-model="pi" type="number" />
+
+  <br />
+
+  <!-- Champ de récupération du rayon -->
+  <label>Rayon de votre cercle:</label>
+  <input ng-model="radius" type="number" />
+  <hr />
+
+  <!-- Affichage des valeurs calculées -->
+  <b>Diamètre: </b><span>{{ 2 * radius }}</span><br />
+  <b>Périmètre: </b><span>{{ 2 * radius * pi }}</span><br />
+
+  <!-- Import de du framework Angular -->
+  <script src="../node_modules/angular/angular.js"></script>
+
+  </body>
+</html>
+```