I'm quite new to Angularjs and Typescript.

I'll try to keep things short here:

The directive (directives/BikeDirective.ts):

class BikeDirective {
    constructor() {
        var directive: ng.IDirective = {};
        directive.restrict = "E";
        directive.scope = {
            move: "="
        };
        directive.template = '<div>The bike</div>';
        directive.link = (scope, element, attrs: any) => {
            element.on('click', (e) => {
                scope.move('moving!');
            });
        }
        return directive;
    }
}
export = BikeDirective;

The Controller (controllers/MyController):

class MyController {
    whatever: string;
    constructor(public scope) {
        this.whatever = "Whatever";
        scope.vm = this;
    }
    onMove(msg: string) {
        console.log(this.whatever);
    }
}
export = MyController;

The HTML:

    <div ng-controller="myController">
        <my-bike move="vm.onMove"></my-bike>
        <my-bike move="vm.onMove"></my-bike>
    </div>

app.ts

import MyController = require("controllers/MyController");
import BikeDirective = require("directives/BikeDirective");

class app {
    constructor() {
        var app = angular.module('app', [])
            .controller('myController', ['$scope', MyController])
            .directive('myBike', [BikeDirective]);
    }
}
export = app;

main.ts

require.config({
    baseUrl: '.',
    paths: {
        jquery: './Scripts/jquery-2.1.0',
        angular: './Scripts/angular'
    },
    shim: {
        'angular': {
            exports: 'angular'
        }
    }
}); 
require(['app','angular','jquery'], (app, angular, $) => {
    new app;
    angular.bootstrap(document.body, ['app']);
});

I hope the above code is self explanatory. Basically, what I want to do is when clicking on one of the bikes (my-bike directive) the MyController.onMove() function is run. That all works fine. The only problem I am having is that when onMove is executed console.log(this.whatever) outputs undefined, shouldn't it output the string "whatever"? Seems like the scope of MyController is not available in the onMove() stub.

I tried this in plain Angularjs (without TypeScript) and it works fine, am I missing something.

Has anybody experienced this before?

I followed .vm technique used by Basarat in this video: http://www.youtube.com/watch?v=WdtVn_8K17E

Thanks