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