Flash消息不會消失（sachinchoolur閃存模塊）AngularJs

我想在我的AngularJs應用程序中使用sachinchoolur's angularjs-flash模塊製作Flash消息。Flash消息不會消失（sachinchoolur閃存模塊）AngularJs

閃爍工作，但在設定的TimeOut後不會消失。

我正確地跟蹤了文檔，並在plnkr中做了一個最小代碼來演示這個問題。

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

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>

來源

2017-04-21 Soundwave

根據how to use | angular-flash爲Flash.create(...)，

第三個參數（數字，可選）是顯示閃光的持續時間。 0不會自動隱藏閃光燈（用戶需要點擊右上角的十字）。

因此，我改變了你Flash.create功能包含5000，而不是0這是您的超時：

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

而且，它的作品！

Here's working example

來源

2017-04-21 13:37:36 tanmay

不錯！謝謝。 – Soundwave

Flash消息不會消失（sachinchoolur閃存模塊）AngularJs

回答

相關問題