Angular structure de base
by Zineb ERRAHMOUNI
HTML
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<div data-ng-controller="myctrl as vm">
<input type="text" ng-model="vm.taskLabel" />
<button ng-click="vm.addTask()" >Ajouter</button>
<span ng-if="error" style="color:red;">Veuillez renseigner une tache avant de valider!!</span>
<br/>
<br/>
Liste des taches :
<ul>
<li ng-repeat="t in tasks">
<input type="checkbox" ng-click="endTask(t.key)" ng-checked="{{ t.done }}">
{{ t.label }}
</li>
</ul>
</div>
JavaScript
"use strict";
(function() {
angular.module("myApp", []);
angular.module("myApp").controller('myctrl', function () {
var vm = this;
vm.key = 0;
vm.error=false;
vm.addTask = function() {
if (vm.taskLabel == null || vm.taskLabel === '') {
vm.error=true;
} else {
vm.error=false;
var task = {key : vm.key, label : vm.taskLabel, done : false}
vm.tasks.push(task);
vm.taskLabel='';
vm.key ++;
}
};
vm.endTask = function(key) {
vm.tasks[key].done = !vm.tasks[key].done;
};
});
})();