| <!DOCTYPE html> |
| <html ng-app="notesApp"> |
| <head> |
| <title>Notes App</title> |
| <script src="../../tp/angular.js"></script> |
| <script src="ch05-03-simple-angular-service.js"></script> |
| </head> |
| <body ng-controller="MainCtrl as mainCtrl"> |
| |
| <h1> Hello Controllers! </h1> |
| |
| <button ng-click="mainCtrl.open('first')"> Open First </button> |
| <button ng-click="mainCtrl.open('second')"> Open Second </button> |
| |
| <div ng-switch on="mainCtrl.tab"> |
| |
| <div ng-switch-when="first"> |
| <div ng-controller="SubCtrl as ctrl"> |
| <h3>First Tab</h3> |
| <button ng-click="ctrl.add()">Add item</button> |
| <ul> |
| <li ng-repeat="item in ctrl.list()"> |
| <span ng-bind="item.label"></span> |
| </li> |
| </ul> |
| </div> |
| </div> |
| |
| <div ng-switch-when="second"> |
| <div ng-controller="SubCtrl as ctrl"> |
| <h3>Second Tab</h3> |
| <button ng-click="ctrl.add()">Add item</button> |
| <ul> |
| <li ng-repeat="item in ctrl.list()"> |
| <span ng-bind="item.label"></span> |
| </li> |
| </ul> |
| </div> |
| </div> |
| </div> |
| |
| </body> |
| </html> |