AngularJS + TypeScript: לא ניתן להזריק את $routeProvider

אני מנסה ליישם ניתוב באפליקציית Angular מבוססת TypeScript שלי. האפליקציה צריכה לקבל את $routeProvider מוזרק עם קוד כזה:

var app = angular.module("MyApp", ["ui.bootstrap"]);
// app.service's and controller's here...

app.config(["$routeProvider",
    function ($routeProvider: ng.IRouteProvider) {
        $routeProvider
            .when("/", {
                controller: MyApp.Controllers.ItemsController,
                templateUrl: "/Items.html"
            })
            // ... other routes ...
            .otherwise({
                redirectTo: "/"
            });
}]);

בכל מקרה, כשאני מפעיל את היישום אני מקבל חריגה מאנגולר שאומרת שהוא לא יכול למצוא את הספק בשם $routeProviderProvider:

Error: Unknown provider: $routeProviderProvider <- $routeProvider at Error (<anonymous>)
    at http://.../Scripts/angular.js:2734:15
    at Object.getService [as get] (http://.../Scripts/angular.js:2862:39)
    at http://.../Scripts/angular.js:2739:45
    at getService (http://.../Scripts/angular.js:2862:39)
    at invoke (http://.../Scripts/angular.js:2880:13)
    at Object.instantiate (http://.../Scripts/angular.js:2914:23)
    at $get (http://.../Scripts/angular.js:4805:24)
    at $get.i (http://.../Scripts/angular.js:4384:17)
    at forEach (http://.../Scripts/angular.js:137:20) undefined angular.js:5754

על ידי הצצה בקוד המקור של Angular (1.0.7), אני יכול לומר שזה נובע מהעובדה שבשורה 2737 שבה נוצר instanceInjector, שמו נוצר על ידי הוספת משתנה בשם providerSuffix, שערכו הוא "Provider", לשם הספק המבוקש (כאן "$routeProvider"). כתוצאה מכך נוצר חריגה. עם זאת, השם הנכון צריך להיות "$routeProvider"; אם אני משנה אותו ל"$route" בקוד שלי, השגיאה הזו נעלמת כמצופה, שכן עכשיו השם שנבנה הוא "$routeProvider"; אך אני מקבל חריגה אחרת שאומרת שהשירות "$route" אינו מוגדר. אז, מה עלי לעשות כדי לפתור זאת?

תשובה #1

תשובה מעודכנת: כמו שציינתי בתגובות למטה

למשל, זה יהיה בלתי חוקי במבקר. לידיעתך, הסעיף שאתה מדבר עליו 'ProviderProvider' הוא רק ליומנים, לא לאופן שבו הוא מחפש את התלות בצורה פנימית

ונמצא בקוד שלך:

export class MainController {
    static $inject = ["$scope", "$routeProvider"];

    constructor(private $scope: IMainScope,
        private $routeProvider: ng.IRouteProvider) {
    }
}

אתה לא יכול להשתמש ב-routeProvider בתוך הבקרים שלך. ה-app.config שלך אינו מה שגורם לשגיאה. שנה את הבקר שלך והשגיאה תיעלם:

export class MainController {
    static $inject = ["$scope"];

    constructor(private $scope: IMainScope) {
    }
}

בנוסף, אני ממליץ לא ליישם סופך (scope) משלך כאשר משתמשים בבקרים (controllers). הנה הסיבה: http://www.youtube.com/watch?v=WdtVn_8K17E&feature=youtu.be&t=5m36s

מקווה שתיהנה מ-Angular + TypeScript כמו שאני נהנה :)