2017-04-21 3 views
0

J'essaie de faire des messages flash dans mon application AngularJs avec l'utilisation du module sachinchoolur's angularjs-flash.Flash Les messages ne disparaissent pas (module flash sachinchoolur) AngularJs

Les clignotements fonctionnent mais ils ne disparaissent pas après le TimeOut défini.

J'ai suivi la documentation correctement et j'ai fait un code minimum dans plnkr pour démontrer le problème.

https://plnkr.co/edit/OaLbAjqZDmeWoPxr5uaf?p=preview

app.js

// public/js/app.js 
angular.module('myApp', ['ngFlash' 


]) 
.config(['$locationProvider', '$httpProvider', 'FlashProvider', 
    function($locationProvider, $httpProvider, FlashProvider) { 
    FlashProvider.setTimeout(5000); 

}]) 


.controller('MainCtrl', function($scope, $rootScope, $http, $location, $window, Flash) { 

    $scope.test = "test"; 
    $scope.show = function() { 
     var message = 'Welcome ' 
     var id = Flash.create('success', message, 0, {class: 'custom-class', id: 'custom-id'}, true); 
     alert("show"); 
    } 
}); 

modèle html:

<!DOCTYPE html> 
<html ng-app="myApp"> 

    <head> 
    <link data-require="[email protected]*" data-semver="4.0.5" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" /> 

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js"></script> 
    <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.0/angular-ui-router.js"></script> 
    <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/script.js/2.4.0/script.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script> 


    <script type="text/javascript" src="app.js"></script> 
    <script type="text/javascript" src="angular-flash.js"></script> 
    </head> 

    <body ng-controller="MainCtrl"> 

    <h1>Hello Plunker!</h1> 
    {{ test }} 

    <flash-message duration="5000"></flash-message> 
    <button ng-click="show()">Test</button> 


    </body> 

</html> 

Répondre

1

Selon how to use | angular-flash pour Flash.create(...),

Le troisième argument (nombre, facultatif) est la durée d'affichage du flash. 0 pour ne pas masquer automatiquement le flash (l'utilisateur doit cliquer sur la croix dans le coin supérieur droit).

Par conséquent, j'ai changé votre fonction Flash.create pour contenir 5000 au lieu de 0 qui était votre délai d'attente:

Flash.create('success', message, 5000, { 
    class: 'custom-class', 
    id: 'custom-id' 
}, true); 

Et ça marche!

Voici working example

+0

Nice! Je vous remercie. – Soundwave