| <!doctype html> |
| <html lang="en"> |
| <head> |
| <meta charset="UTF-8"> |
| <title>Example - example-example22-debug</title> |
| |
| |
| <script src="../../../angular.js"></script> |
| |
| |
| |
| </head> |
| <body ng-app=""> |
| <script> |
| function SettingsController2($scope) { |
| $scope.name = "John Smith"; |
| $scope.contacts = [ |
| {type:'phone', value:'408 555 1212'}, |
| {type:'email', value:'john.smith@example.org'} ]; |
| |
| $scope.greet = function() { |
| alert(this.name); |
| }; |
| |
| $scope.addContact = function() { |
| this.contacts.push({type:'email', value:'yourname@example.org'}); |
| }; |
| |
| $scope.removeContact = function(contactToRemove) { |
| var index = this.contacts.indexOf(contactToRemove); |
| this.contacts.splice(index, 1); |
| }; |
| |
| $scope.clearContact = function(contact) { |
| contact.type = 'phone'; |
| contact.value = ''; |
| }; |
| } |
| </script> |
| <div id="ctrl-exmpl" ng-controller="SettingsController2"> |
| Name: <input type="text" ng-model="name"/> |
| [ <a href="" ng-click="greet()">greet</a> ]<br/> |
| Contact: |
| <ul> |
| <li ng-repeat="contact in contacts"> |
| <select ng-model="contact.type"> |
| <option>phone</option> |
| <option>email</option> |
| </select> |
| <input type="text" ng-model="contact.value"/> |
| [ <a href="" ng-click="clearContact(contact)">clear</a> |
| | <a href="" ng-click="removeContact(contact)">X</a> ] |
| </li> |
| <li>[ <a href="" ng-click="addContact()">add</a> ]</li> |
| </ul> |
| </div> |
| </body> |
| </html> |