aggiungere dolce allarme js angolari

Question

Sono nuovo di AngularJS e sto cercando di utilizzare plug-in allerta dolce da https://github.com/oitozero/ngSweetAlert, ho già aggiunto gli script corrispondenti al mio index.html come questo:

index.html

<link rel="stylesheet" href="bower_components/sweetalert/dist/sweetalert.css"> 
<script src="bower_components/angular-sweetalert/SweetAlert.min.js"></script> 
<script src="bower_components/sweetalert/dist/sweetalert.min.js"></script> 

Come dice la documentazione. Ora nei miei ctrl.js ho questo:

var ctrl = function ($scope, SweetAlert) { 

    SweetAlert.swal("Here's a message"); // this does not work 
} 

ctrl.$inject = ['$scope', 'oitozero.ngSweetAlert]; 

angular.module('myApp.missolicitudes.controllers', 
    [ 
     'oitozero.ngSweetAlert' 
    ]) 
    .controller('MiSolicitudCtrl', ctrl); 

Ma non funziona, il mio browser ho ottenuto questo errore da strumenti di sviluppo:

Error: [$injector:unpr] http://errors.angularjs.org/1.4.3/ $injector/unpr?p0=oitozero.ngSweetAlertProvider%20%3C-""itozero.ngSweetAlert%20%3C-%20MiSolicitudCtrl at Error (native) at http://localhost:8081/assets/libs/angular/angular.min.js:6:416 at http://localhost:8081/assets/libs/angular/angular.min.js:40:375 at Object.d [as get] (http://localhost:8081/assets/libs/angular/angular.min.js:38:364) at http://localhost:8081/assets/libs/angular/angular.min.js:40:449 at d (http://localhost:8081/assets/libs/angular/angular.min.js:38:364) at e (http://localhost:8081/assets/libs/angular/angular.min.js:39:124) at Object.instantiate (http://localhost:8081/assets/libs/angular/angular.min.js:39:273) at $get (http://localhost:8081/assets/libs/angular/angular.min.js:80:228) at link (http://localhost:8081/assets/libs/angular/angular-route.min.js:7:268)

Come posso attuare correttamente questo plugin?

Aggiornamento 1

Ho già provare questo suggerimento di @Pankaj Parkar e @ Mike G

ctrl.$inject = ['$scope', 'oitozero.ngSweetAlert']; 

e come questo

ctrl.$inject = ['$scope', 'SweetAlert']; 

I miei strumenti di sviluppo tiri questo messaggio:

Error: [$injector:unpr] http://errors.angularjs.org/1.4.3/$injector/unpr?p0=oitozero.ngSweetAlertProvider%20%3C-"<div class="container ng-scope" ng-view="">"itozero.ngSweetAlert%20%3C-%20MiSolicitudCtrl 
at Error (native) 
at http://localhost:8081/assets/libs/angular/angular.min.js:6:416 
at http://localhost:8081/assets/libs/angular/angular.min.js:40:375 
at Object.d [as get] (http://localhost:8081/assets/libs/angular/angular.min.js:38:364) 
at http://localhost:8081/assets/libs/angular/angular.min.js:40:449 
at d (http://localhost:8081/assets/libs/angular/angular.min.js:38:364) 
at e (http://localhost:8081/assets/libs/angular/angular.min.js:39:124) 
at Object.instantiate (http://localhost:8081/assets/libs/angular/angular.min.js:39:273) 
at $get (http://localhost:8081/assets/libs/angular/angular.min.js:80:228) 
at link (http://localhost:8081/assets/libs/angular/angular-route.min.js:7:268) 

Answer 1

Non immettere mai module in controller come dipendenza. Dovresti inserire lo stabilimento SweetAlert che ha varie funzioni per mostrare gli avvisi. Aggiungere anche il valore mancante ' qoute all'iniezione di fabbrica.

Si dovrebbe usare

ctrl.$inject = ['$scope', 'SweetAlert'];//<==`oitozero.ngSweetAlert` module    
              //could be injectable inside your app module. 

Demo Plunkr

Answer 2

ho ottenuto il lavoro, da NON iniettarlo nel modulo.

miei ctrl.js appena ricevuto come questo

ctrl.$inject = ['$scope']; 

e dentro il mio controller y basta chiamare in questo modo

var ctrl = function ($scope) { 
    swal("Here's a message"); 
} 

e funziona !, io non so se il modo corretto ... ma almeno funziona.

Answer 3

Ecco un semplice modulo che ho scritto per far funzionare SweetAlert.

// sweetalert.js 

angular 
    .module('sweetalert', []) 
    .factory('swal', SweetAlert); 

function SweetAlert() { 
    return window.swal; 
}; 

Quindi, non è necessario utilizzare qualsiasi altra libreria per utilizzare sweetalert, è sufficiente scrivere il proprio.

Basta iniettare il modulo nel controller dove si desidera utilizzarlo.

Esempio

angular 
    .module('demo', ['sweetalert']) 
    .controller('DemoController', DemoController); 

function DemoController($scope) { 
    $scope.btnClickHandler = function() { 
    swal('Hello, World!'); 
    }; 
}; 

Ecco un esempio succo in CoffeeScript: https://gist.github.com/pranav7/d075f7cd8263159cf36a

Answer 4

Iniettare sweetalert.min.js e sweetalert.css. Usato come questo codice nel vostro controller

swal({ 
     type: "error", 
     title: "Error!", 
     text: "fail", 
     confirmButtonText: "OK" 
     }); 

`