Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- /**
- * Module definition and dependencies
- */
- angular.module('App.Parent', [])
- /**
- * Component
- */
- .component('parent', {
- templateUrl: 'parent.html',
- controller: 'ParentCtrl',
- })
- /**
- * Controller
- */
- .controller('ParentCtrl', function($parentDep) {
- //Get controller
- const $ctrl = this;
- /**
- * On init
- */
- this.$onInit = function() {
- //Do stuff
- this.something = true;
- };
- });
- /**
- * Module definition and dependencies
- */
- angular.module('App.Child', [])
- /**
- * Component
- */
- .component('child', {
- templateUrl: 'child.html',
- controller: 'ChildCtrl',
- })
- /**
- * Controller
- */
- .controller('ChildCtrl', function($controller, $parentDep) {
- //Get controllers
- const $ctrl = this;
- const $base = $controller('ParentCtrl', {$parentDep});
- //Extend
- angular.extend($ctrl, $base);
- /**
- * On init
- */
- this.$onInit = function() {
- //Call parent init
- $base.$onInit.call(this);
- //Do other stuff
- this.somethingElse = true;
- };
- });
- angular
- .module('app')
- .factory('component.utils', function() {
- return {
- sharedProp: 'foo',
- sharedMethod: function() { return 'bar' }
- }
- })
- // components can all easily use functionality
- // provided by one (or more) services, w/o
- // needing a complicated inheritance model.
- .component('foo', {
- templateUrl: 'foo.html',
- controller: [
- 'component.utils',
- function(utils) {
- this.$onInit = function() {
- this.prop = utils.sharedProp;
- utils.sharedMethod();
- // now do other foo things...
- }
- }
- ]
- })
- .component('bar', {
- templateUrl: 'foo.html',
- controller: [
- 'component.utils',
- function(utils) {
- this.$onInit = function() {
- this.prop = utils.sharedProp;
- utils.sharedMethod();
- // now do other bar things...
- }
- }
- ]
- });
Add Comment
Please, Sign In to add comment