Jhipster生成的应用程序,默认的AngularJS注册表单

时间:2016-09-25 12:56:16

标签: javascript angularjs jhipster

我使用JHipster创建了一个应用程序并尝试编辑`register.html'。我需要帮助的代码如下所示:

<div class="alert alert-success" ng-show="vm.success" data translate="register.messages.success">
    <strong>Registration saved!</strong> Please check your email for confirmation.
</div>

<div class="alert alert-danger" ng-show="vm.error" data-translate="register.messages.error.fail">
    <strong>Registration failed!</strong> Please try again later.
</div>

我省略了其余的代码,因为它们与这两个代码相同,只有不同的消息和ng-models。 &安培; register.controller.js

(function() {
'use strict';

angular
    .module('MyApp')
    .controller('RegisterController', RegisterController);


RegisterController.$inject = ['$translate', '$timeout', 'Auth', 'LoginService'];

function RegisterController ($translate, $timeout, Auth, LoginService) {
    var vm = this;

    vm.doNotMatch = null;
    vm.error = null;
    vm.errorUserExists = null;
    vm.login = LoginService.open;
    vm.register = register;
    vm.registerAccount = {};
    vm.success = null;

    $timeout(function (){angular.element('#login').focus();});

    function register () {
        if (vm.registerAccount.password !== vm.confirmPassword) {
            vm.doNotMatch = 'ERROR';
        } else {
            vm.registerAccount.langKey = $translate.use();
            vm.doNotMatch = null;
            vm.error = null;
            vm.errorUserExists = null;
            vm.errorEmailExists = null;

            Auth.createAccount(vm.registerAccount).then(function () {
                vm.success = 'OK';
            }).catch(function (response) {
                vm.success = null;
                if (response.status === 400 && response.data === 'login already in use') {
                    vm.errorUserExists = 'ERROR';
                } else if (response.status === 400 && response.data === 'e-mail address already in use') {
                    vm.errorEmailExists = 'ERROR';
                } else {
                    vm.error = 'ERROR';
                }
            });
        }
    }
}
})();

我的问题是默认情况下必须隐藏错误处理消息,并且一旦评估了表单,就应该根据条件显示它们。但我无法弄清楚如何使这项工作...... 以下是默认的register.html页面: Default register page

1 个答案:

答案 0 :(得分:1)

默认情况下,生成的register.html不会显示这些消息。看起来您只是将HTML文件加载到浏览器中,但是您需要运行应用程序并从那里加载index.html以运行Angular代码。

运行./mvnw./gradlew并访问http://localhost:8080的前端 您还可以运行gulp,当您进行更改时,{{1}}会在http://localhost:9000为您的前端提供实时重新加载功能。更多信息可以在Using JHipster in development文档

中找到

正确运行时,注册页面如下图所示:enter image description here