JMac
JMac

Reputation: 1756

Typescript Generics - Extending a class

As an example, I have the following class:

module app.components.base {
    export class BaseController<S extends IAppScope, A> {
        public data:string;

        constructor(public $scope: S, public service: A, public $state: ng.ui.IStateService, public $ionicHistory) {
            console.log('Base Controller Loaded!');
            console.log($scope);
            $scope.vm = this;
        }
    }
}

Then I have this separate class:

module app.components.properties {

    export class PropertiesController extends base.BaseController<IPropertiesScope, app.services.PropertyService> {

    }
}

So, in my mind, this says "The Properties Controller extends the Base Controller. The Properties Controller therefore should have this.$scope, and this.$scope should be of type IPropertiesScope since the generic type S inherits the IPropertiesScope interface`."

However, $scope is undefined in the constructor of my base class. Why is this value undefined?

Upvotes: 0

Views: 694

Answers (1)

basarat
basarat

Reputation: 276239

$scope is undefined in the constructor of my base class. Why is this value undefined?

This is because of the way angular's default dependency injection works. Even though you know the constructor arguments and TypeScript knows the constructor arguments, all that angular will see is in code :

function PropertiesController() {
   _super.apply(this, arguments);
}

You can see that TypeScript will pass thorugh the arguments just fine, however angular will see PropertiesController() and not dependency inject anything.

Fix: Have an explicit constructor

Alternatively have an explicit static $inject member on the class https://www.youtube.com/watch?v=WdtVn_8K17E

Upvotes: 1

Related Questions