angular-ui-bootstrap causa un errore sconosciuto del provider quando minified

Question

Dopo aver aggiunto angular-ui-bootstrap e eseguito grunt serve sulla mia app yeoman, funziona perfettamente e il modal che voglio mostrare viene visualizzato correttamente, ma una volta che faccio un grugnito build, ricevo un errore sconosciuto del fornitore nella mia console.

<!-- This is what I added in my index.html --> 
<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script> 

// In app.js I have 
angular.module('yeomanApp', [ 
    'ngCookies', 
    'ngResource', 
    'ngSanitize', 
    'ngRoute', 
    'ui.bootstrap' 
]) 

e nel controller,

.controller('myCntrl', function ($modal) { 

$scope.items = ['item1', 'item2', 'item3']; 

$scope.showDeleteWarning = function() { 
    var modalInstance = $modal.open({ 
     templateUrl: 'deleteWarning.html', 
     controller: ModalInstanceCtrl, 
     resolve: { 
      items: function() { 
       return $scope.items; 
      } 
      } 
     }); 

    modalInstance.result.then(function (selectedItem) { 
     $scope.selected = selectedItem; 
    }, function() {}); 
    }; 

// Please note that $modalInstance represents a modal window (instance) dependency. 
// It is not the same as the $modal service used above. 

var ModalInstanceCtrl = function ($scope, $modalInstance, items) { 

    $scope.items = items; 
    $scope.selected = { 
    item: $scope.items[0] 
    }; 

    $scope.ok = function() { 
    $modalInstance.close($scope.selected.item); 
    deleteVent(); 
    }; 

    $scope.cancel = function() { 
    $modalInstance.dismiss('cancel'); 
    }; 
}; 

}; 

Answer 1

Probabile che è necessario iniettare la vostra dipendenza del controller ...

https://docs.angularjs.org/tutorial/step_05#a-note-on-minfication

.controller('myCntrl', ['$modal', function ($modal) { 
    /* Controller Code Here... */ 
}]); 

Answer 2

So che questa è una vecchia questione , ma posterò la mia risposta qui per le persone che si imbattono in questo problema in futuro.

Mi sono imbattuto in questo esatto problema prima. La causa dei tuoi errori durante la minimizzazione è molto probabilmente il tuo 'var ModalInstanceCtrl'.

Ecco come ho ottenuto il mio codice per lavorare:

var modalInstance = $modal.open({ 
    templateUrl: 'deleteWarning.html', 
    controller: 'ModalInstanceCtrl', //change this to a string 
    resolve: { 
     items: function() { 
      return $scope.items; 
     } 
     } 
    }); 

e questa linea:

var ModalInstanceCtrl = function ($scope, $modalInstance, items) { 

a:

angular.module('myModule').controller('ModalInstanceCtrl', function ($scope, $modalInstance, items) { 

Answer 3

Per tutti coloro che hanno appena incontrato questo problema, forse questo aiuterà. Usiamo customModalDefaults e customModalOptions, così abbiamo dovuto trasformare l'intero return $modal.open(tempModalDefaults).result; nella funzione spettacolo al seguente:

this.show = function (customModalDefaults, customModalOptions) { 
    //Create temp objects to work with since we're in a singleton service 
    var tempModalDefaults = {}; 
    var tempModalOptions = {}; 

    //Map angular-ui modal custom defaults to modal defaults defined in service 
    angular.extend(tempModalDefaults, modalDefaults, customModalDefaults); 

    //Map modal.html $scope custom properties to defaults defined in service 
    angular.extend(tempModalOptions, modalOptions, customModalOptions); 

    return $modal.open({ 
     backdrop: customModalDefaults.backdrop, 
     keyboard: customModalDefaults.keyboard, 
     modalFade: customModalDefaults.modalFade, 
     templateUrl: customModalDefaults.templateUrl, 
     size: customModalDefaults.size, 
     controller: ['$scope', '$modalInstance', function ($scope, $modalInstance) { 
      $scope.modalOptions = tempModalOptions; 
      $scope.modalOptions.ok = function (result) { 
       $modalInstance.close(result); 
      }; 
      $scope.modalOptions.close = function (result) { 
       $modalInstance.dismiss('cancel'); 
      }; 
     } ] 
    }).result; 
}; 

Answer 4

Ho appena incontrato questo problema su solo uno dei tanti modali utilizzati in tutto la mia domanda, e si è rivelato il mio problema non stava usando explicit function annotation nel blocco di risoluzione della configurazione modale.

var modalInstance = $uibModal.open({ 
    templateUrl: 'preferences.html', 
    controller: 'preferencesCtrl as ctrl', // this external controller was using explicit function annotation... 
    resolve: { 
    parent: [function() { 
     return ctrl; 
    }], 
    sectorList: ['preferencesService', function(preferencesService) { // but this was not! 
     return preferencesService.getSectors(); 
    }] 
    } 
}); 

Spero che questo salva qualcun altro i capelli grigi o due ...