Last active
August 29, 2015 14:15
-
-
Save ryepup/287bbebf898aed7fe4a5 to your computer and use it in GitHub Desktop.
component directive
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div> | |
| <pre>{{vm.ngModel|json}}</pre> | |
| <button ng-click="vm.save()" ng-disabled="vm.saving">Save</button> | |
| </div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| angular.module('my-app') | |
| .directive('my-component', function() { | |
| return { | |
| templateUrl: 'my-component.html', | |
| // put logic in a controller, available to the view as `vm` | |
| controller: 'MyComponentCtrl as vm', | |
| // inputs to the component | |
| scope: { ngModel:'=' }, | |
| // bind inputs directly to the controller | |
| bindToController: true | |
| }; | |
| }) | |
| .controller('MyComponentCtrl', function(MyService) { | |
| // initialize the controller, create functions for the template | |
| var vm = this; | |
| vm.save = function() { | |
| vm.saving = true; // let the view know we're working | |
| MyService.save(vm.ngModel) | |
| .then(function() { | |
| vm.saving = false; | |
| }); | |
| }; | |
| }); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment