Monday, 15 March 2010

javascript - What is the proper way to load dependencies in a controller super class of an AngularJS application? -



javascript - What is the proper way to load dependencies in a controller super class of an AngularJS application? -

i building angularjs application provides basic crud features. app built using typescript take advantage of types , classes. have base of operations controller needs access several angularjs dependencies. originally, injected dependencies follows

file: base-controller.ts

class basecontroller { private $location; private $routeparams; constructor($location, $routeparams) { /* manually inject dependencies */ this.$location = $injector.get('$location'); this.$routeparams = $injector.get('$routeparams '); } }

file: list-controller.ts

class workrequestlistcontroller extends basecontroller { /* write code override base of operations controller or implement local methods */ } angular.module('app.workrequests') .controller('workrequestlistcontroller', ['$location', '$routeparams', ($location, $routeparams) => new workrequestlistcontroller($location, $routeparams) ]);

this solution works, requires subclass aware of dependencies required base of operations class. if ever need dependency in base of operations class, have alter every subclass , statement instantiates controller. prepare these issues, pass $injector base of operations class follows:

file: base-controller.ts

class basecontroller { private $location; private $routeparams; constructor($injector) { /* load dependencies */ this.$location = $injector.get('$location'); this.$routeparams = $injector.get('$routeparams'); } }

file: list-controller.ts

class workrequestlistcontroller extends basecontroller { /* write code override base of operations controller or implement local methods */ } angular.module('app.workrequests') .controller('workrequestlistcontroller', ['$injector', ($injector) => new workrequestlistcontroller($injector) ]);

here's question: right way load dependencies in super class without forcing subclass or other code aware of dependencies?

there's simple way implement base of operations controller using $controller service. wrote blog post recently, here's code snippet showing how works:

'use strict'; angular.module('diary') // base of operations controller containing mutual functions add/edit controllers .controller('diary.baseaddeditcontroller', ['$scope', 'diaryservice', function ($scope, diaryservice) { $scope.diaryentry = {}; $scope.savediaryentry = function () { diaryservice.savediaryentry($scope.diaryentry); }; // add together other shared functionality here. }]) .controller('diary.adddiarycontroller', ['$scope', '$controller', function ($scope, $controller) { // instantiate base of operations controller $controller('diary.baseaddeditcontroller', { $scope: $scope }); }]) .controller('diary.editdiarycontroller', ['$scope', '$routeparams', 'diaryservice', '$controller', function ($scope, $routeparams, diaryservice, $controller) { // instantiate base of operations controller $controller('diary.baseaddeditcontroller', { $scope: $scope }); diaryservice.getdiaryentry($routeparams.id).success(function (data) { $scope.diaryentry = data; }); }]);

javascript angularjs typescript

No comments:

Post a Comment