如何自动关闭 JHipster 上的警报？

Question

我最近在 JHipster 中发现并开始开发。

我面临的首要障碍之一是自动关闭警报。到目前为止，我了解到 JHipster 使用Bootstrap UI alerts，所以我正在尝试调整捆绑在sample project of JHipster 中的警报，当用户尝试登录时，它们会显示在主页中（绿色的那个）：

警报的HTML代码如下：

        <div ng-switch="vm.isAuthenticated()">
            <div class="alert alert-success" ng-switch-when="true" data-translate="home.logged.message" translate-values="{username: '{{vm.account.login}}'}">
                You are logged in as user "{{vm.account.login}}".
            </div>
        </div>

我修改如下：

            <div class="alert alert-success" ng-switch-when="true" data-translate="home.logged.message" translate-values="{username: '{{vm.account.login}}'}" close="closeAlert()" ng-if="show" dismiss-on-timeout="3000" >
                You are logged in as user "{{vm.account.login}}".
            </div>

Javascript 文件 home.controller.js 如下所示：

(function() {
'use strict';

angular
    .module('pruebablogApp')
    .controller('HomeController', HomeController);

HomeController.$inject = ['$scope', 'Principal', 'LoginService', '$state', 'AlertService'];

function HomeController ($scope, Principal, LoginService, $state, AlertService) {
    var vm = this;

    vm.account = null;
    vm.isAuthenticated = null;
    vm.login = LoginService.open;
    vm.register = register;
    $scope.$on('authenticationSuccess', function() {

        getAccount();
    });

    getAccount();

    function getAccount() {
        Principal.identity().then(function(account, $scope) {
            vm.account = account;
            vm.isAuthenticated = Principal.isAuthenticated;

            if (vm.isAuthenticated){
                $scope.show = true;
                }

        });
    }
    function register () {
        $state.go('register');
    }


    function closeAlert () {
        $scope.show = false;
    }
}
})();

这种方法对我不起作用。我尝试了其他方法，例如this one 或this one（应该适用于按钮点击）。

我做错了什么？

Answer 1

JHipster 正在使用AlertService 作为服务来创建您想要创建的消息类型（例如信息、警告、危险等），并且消息与 一起显示 标签。查看示例应用程序中的实体以查看标签jhi-alert 的实际作用。您只需在 html 站点中编写标签，然后使用 AlertService 在控制器中创建您想要创建和显示的消息。

@Gaël Marziou 您的回答更深入地了解幕后实际发生的事情。我可以看看吗？