AngularJS + TypeScript: tidak dapat menyuntikkan $routeProvider

Saya sedang mencoba menerapkan routing pada aplikasi Angular berbasis Typescript saya. Aplikasi ini seharusnya mendapatkan $routeProvider yang disuntikkan dengan kode seperti ini:

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: "/"
            });
}]);

Ngomong-ngomong, ketika saya memulai aplikasi, saya mendapatkan pengecualian dari Angular yang memberitahu saya bahwa itu tidak dapat menemukan penyedia bernama $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

Dengan mengintip sumber Angular (1.0.7), saya bisa mengatakan ini berasal dari fakta bahwa pada baris 2737 di mana instanceInjector dibuat, namanya berasal dari penggabungan variabel bernama providerSuffix, yang nilainya adalah "Provider", ke nama penyedia yang diminta (di sini "$routeProvider"). Dengan demikian, ini menghasilkan pengecualian. Namun, nama yang benar seharusnya "$routeProvider"; jika saya mengubahnya menjadi hanya "$route" dalam kode saya, kesalahan ini hilang seperti yang diharapkan, karena sekarang nama yang dibangun adalah "$routeProvider"; tetapi saya mendapatkan pengecualian lain yang memberi tahu saya bahwa layanan "$route" tidak didefinisikan. Jadi, apa yang harus saya lakukan untuk menyelesaikannya?

Jawaban #1

Jawaban terbaru: Seperti yang saya sebutkan di komentar di bawah

misalnya itu akan tidak valid di dalam sebuah controller. FYI Bagian yang sedang kamu bicarakan "ProviderProvider" hanya untuk logging, bukan cara internalnya mencari dependensi

Dan ditemukan dalam kode Anda:

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

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

Anda tidak bisa menggunakan routeProvider di dalam controller Anda. app.config Anda bukan yang menyebabkan kesalahan tersebut. Ubah controller Anda dan kesalahan akan hilang:

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

    constructor(private $scope: IMainScope) {
    }
}

Selain itu, saya menyarankan untuk tidak membuat scope sendiri ketika menggunakan controller. Ini alasannya: http://www.youtube.com/watch?v=WdtVn_8K17E&feature=youtu.be&t=5m36s

Semoga kamu menikmati Angular + TypeScript sebanyak yang saya nikmati :)