“Kesalahan Tidak Tertangkap: [$ injektor: tidak]” dengan sudut setelah penerapan

Saya memiliki aplikasi Angular yang cukup sederhana yang berjalan dengan baik di mesin dev saya, tetapi gagal dengan pesan kesalahan ini (di konsol browser) setelah saya menerapkannya:

Uncaught Error: [$injector:unpr] http://errors.angularjs.org/undefined/$injector/unpr?p0=tProvider%20%3C-%20t%20%3C-%20%24http%20%3C-%20%24compile

Tidak ada pesan lain selain itu. Itu terjadi saat halaman pertama kali dimuat.

Saya menjalankan ASP.NET MVC5, Angular 1.2RC3, dan mendorong ke Azure melalui git.

Googling belum menghasilkan sesuatu yang menarik.

Ada saran?

EDIT:

Saya menggunakan TypeScript, dan mendefinisikan dependensi saya dengan $injectvariabel, misalnya:

export class DashboardCtrl {

    public static $inject = [
        '$scope',
        '$location',
        'dashboardStorage'
    ];

    constructor(
        private $scope: IDashboardScope,
        private $location: ng.ILocationService,
        private storage: IDashboardStorage) {
    }
}

Saya percaya bahwa harus (atau dimaksudkan untuk) mengatasi masalah penggantian nama variabel lokal yang muncul selama minifikasi dan yang dapat menyebabkan kesalahan ini.

Meski begitu, ini jelas ada hubungannya dengan proses minifikasi, seperti saat saya menyetel BundleTable.EnableOptimizations = truemesin dev, saya bisa mereproduksinya.

Jika Anda mengikuti tautan Anda, ini memberi tahu Anda bahwa hasil kesalahan dari $ injektor tidak dapat menyelesaikan ketergantungan Anda. Ini adalah masalah umum dengan angular ketika javascript dikecilkan / di-uglified / apa pun yang Anda lakukan untuk produksi.

Masalahnya adalah ketika Anda memiliki misalnya pengontrol;

angular.module("MyApp").controller("MyCtrl", function($scope, $q) {
  // your code
})

Minifikasi berubah $scopedan $qmenjadi variabel acak yang tidak memberi tahu sudut apa yang harus dimasukkan. Solusinya adalah mendeklarasikan dependensi Anda seperti ini:

angular.module("MyApp")
  .controller("MyCtrl", ["$scope", "$q", function($scope, $q) {
  // your code
}])

Itu seharusnya memperbaiki masalah Anda.

Hanya untuk mengulang, semua yang saya katakan ada di tautan yang diberikan pesan kesalahan kepada Anda.

Saya sendiri mengalami masalah yang sama, tetapi definisi pengontrol saya terlihat sedikit berbeda dari di atas. Untuk pengontrol yang ditentukan seperti ini:

function MyController($scope, $http) {
    // ...
}

Cukup tambahkan baris setelah deklarasi yang menunjukkan objek mana yang akan dimasukkan saat pengontrol dibuat:

function MyController($scope, $http) {
    // ...
}
MyController.$inject = ['$scope', '$http'];

Ini membuatnya aman untuk minifikasi.

Masalah ini terjadi ketika pengontrol atau direktif tidak ditentukan sebagai larik dependensi dan fungsi. Sebagai contoh

angular.module("appName").directive('directiveName', function () {
    return {
        restrict: 'AE',
        templateUrl: 'calender.html',
        controller: function ($scope) {
            $scope.selectThisOption = function () {
                // some code
            };
        }
    };
});

Ketika diminimalkan, '$ scope' yang diteruskan ke fungsi controller diganti dengan nama variabel satu huruf. Ini akan membuat sudut tidak mengerti ketergantungan. Untuk menghindari hal ini, berikan nama dependensi bersama dengan fungsi sebagai array.

angular.module("appName").directive('directiveName', function () {
    return {
        restrict: 'AE',
        templateUrl: 'calender.html'
        controller: ['$scope', function ($scope) {
            $scope.selectThisOption = function () {
                // some code
            };
        }]
    };
});

Jika Anda telah memisahkan file untuk aplikasi sudut \ resources \ directives dan hal-hal lain, maka Anda dapat menonaktifkan minifikasi bundel aplikasi sudut Anda seperti ini (gunakan Bundle baru () alih-alih ScriptBundle () di file konfigurasi bundel Anda):

bundles.Add(
new Bundle("~/bundles/angular/SomeBundleName").Include(
               "~/Content/js/angular/Pages/Web/MainPage/angularApi.js",
               "~/Content/js/angular/Pages/Web/MainPage/angularApp.js",
               "~/Content/js/angular/Pages/Web/MainPage/angularCtrl.js"));

Dan aplikasi sudut akan muncul dalam bundel yang tidak dimodifikasi.

Jika Anda telah memisahkan file untuk aplikasi sudut \ resources \ directives dan hal-hal lain, maka Anda dapat menonaktifkan minifikasi bundel aplikasi sudut Anda seperti ini (gunakan Bundle baru () alih-alih ScriptBundle () di file konfigurasi bundel Anda):

Tambahkan $ http, $ scope services di controller fucntion, terkadang jika mereka tidak ada kesalahan ini terjadi.

Saya memiliki masalah yang sama tetapi masalahnya berbeda, saya mencoba membuat layanan dan mengirimkan $ scope ke sana sebagai parameter.
Itu cara lain untuk mendapatkan kesalahan ini seperti dokumentasi tautan itu:

Mencoba memasukkan objek cakupan ke dalam apa pun yang bukan pengontrol atau arahan, misalnya layanan, juga akan memunculkan penyedia Tidak Dikenal: $ scopeProvider <- $ scope error. Ini mungkin terjadi jika seseorang salah mendaftarkan pengontrol sebagai layanan, mis .:

angular.module('myModule', [])
       .service('MyController', ['$scope', function($scope) {
        // This controller throws an unknown provider error because
        // a scope object cannot be injected into a service.
}]);