Angular structure de base

by Zineb ERRAHMOUNI

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-route.js"></script>
<script type="text/ng-template" id="fiche.html">
	<div data-ng-controller="ficheController as vm">
		Fiches
	
		<label>nom: </label> <input type="text" ng-model="vm.fiches.name" /> <br/>
		<label>prneom:</label> <input type="text" ng-model="vm.fiches.surname" /><br/>
		<label>date de naissance:</label> <input type="text" ng-model="vm.fiches.dn" /><br/>
	
		<button data-ng-click="vm.addFiche()" >Ajouter</button> 
	</div>
</script>
<script type="text/ng-template" id="details.html">
	
</script>

<div data-ng-controller="ficheController as vm">
 
	Listes des fiches : 
	 <ul>
      <li ng-repeat="fiche in vm.fiches"> 
       
			 <span ng-click=""> {{ fiche.name }}  </span>
        
      </li>
  </ul>
	
	<button data-ng-click="vm.goToPageFiche()"> create new fiche </button>
	
</div>

CSS

qsd

JavaScript

"use strict";

(function() {
    
		var ficheController = function ($routeParams) {
    	var mc = this;
			mc.fiches = [];
			mc.key = 0;
			
      mc.addFiche = function() {
      	if (mc.fiches.name == null || mc.fiches.name === '') {
        } else {
        	var fiche = {key : mc.key, name : mc.fiches.name, surname : mc.fiches.surname, dn : mc.fiches.dn}
          mc.fiches.push(fiche);
          mc.fiches.name = '';
					mc.fiches.surname ='';
				  mc.fiches.dn = '';
          mc.fiches.key ++;
        }
      };
		
			mc.goToDetail = function (){
			
			
			};
        
    };
		
		ficheController.$inject = ['$routeParams']
		
		var ficheDetailsController = function () {
    	var mc = this;
			
			
     
        
    };
		
    angular.module("myApp", []);
		// controller pour gérer les fiches
		angular.module("myApp").controller('ficheController',ficheController);
		// controller pour gérer les détails des fiches
		angular.module("myApp").controller('ficheDetailsController',ficheDetailsController);
		// déclarer la route
   
	 angular.module("myApp").config(function($routeProvider)
			$routeProvider.when("/fiches" , {
													templateUrl  : "fiches.html",
													controller: "ficheController"})
										.when("/details", {
												templateUrl : "details.html",
											  controller: "ficheDetailsController"
							      });
				});
 }
		
})();