我对此组件有疑问。如果我直接打开页面,您会看到警告。如果我从另一个页面到达该页面则不会。
ROUTER:
$stateProvider.state('login', {
url: '/login',
templateUrl: "assets/views/login.html",
resolve: loadSequence('modernizr', 'moment', 'sweet-alert', 'oitozero.ngSweetAlert', 'toaster'),
abstract: true
}).state('login.lockscreen', {
url: '/lock',
templateUrl: "assets/views/login_lock_screen.html",
title: 'Lock screen',
resolve: loadSequence('userLoginCtrl')
});
警报工厂:
'use strict';
app.factory("alertGenerate", ["toaster", function(toaster) {
return {
show: function(options) {
console.log("SHOW ALERT");
console.log(options);
/*
* TOASTER
*/
var config = {
type: options.type,
title: options.title,
body: options.text
};
if(options.confirmButtonText || options.showCloseButton) {
config.showCloseButton = true;
}
toaster.pop(config);
}
}
}]);
控制器:
app.controller('UserLoginCtrl', ["$rootScope", "$scope", "$auth", "$http", "$state", "$filter", "alertGenerate", function ($rootScope, $scope, $auth, $http, $state, $filter, alertGenerate) {
alertGenerate.show({
type: 'error',
title: 'Title text',
body: 'Body text',
showCloseButton: true,
closeHtml: '<button>Close</button>'
});
login.html(摘要)
<!-- toaster directive -->
<toaster-container toaster-options="{'position-class': 'toast-bottom-right', 'close-button':true}"></toaster-container>
<!-- / toaster directive -->
<div ui-view class="fade-in-right-big smooth"></div>
login_lock_screeen.html
<!-- start: LOCK SCREEN -->
<div class="row">
<div class="lock-screen">
hello
</div>
</div>