Angular 6 - браузер триггеров сохраняет запрос на вход в систему

Итак, я уже создаю небольшое приложение (учебная цель) для управления некоторыми данными. Проблема в том, что браузер не предлагает сохранить учетную запись на странице входа, поскольку все приложение single page app, и я хочу, чтобы мой браузер предлагал сохранить учетную запись для входа. Я уже нашел ответ, который, вероятно, подходит для меня, но поскольку я только изучаю этот angular 6, я не могу связать их. Итак, вот мой код.

login.component.ts

@Component({
    selector: 'app-login',
    templateUrl: './login.component.html',
    styleUrls: ['./login.component.css']
})
export class LoginComponent implements OnInit {
    loginForm : FormGroup;

     username = "";
     password = "";

    constructor(
            public global: GlobalService,
            public messagerService: MessagerService,
            private cookie: CookieService, //persistent
            private router: Router,
            private fb: FormBuilder
        ) {
              this.loginForm = fb.group({
                  username: ["asdsa", Validators.required],
                  password: ["adssa", Validators.required]
              });
           }

    login(){
        var helper = new JwtHelperService();
        if(this.username=='' || this.password=='')
            this.messagerService.alert({
                title: 'Error',
                icon: 'error',
                msg: 'Please fill the forms!'
            });
        else{
            this.global.login(this.username, this.password).subscribe(
                data => {
                    if(data.success=='1'){
                        this.cookie.set('jwtObj', data.jwt, new Date().getSeconds() + 7200, '/');
                        this.global.loginCheck();
                    }
                    else if(data.success == '0'){
                        this.messagerService.alert({
                            title: 'Error',
                            icon: 'error',
                            msg: data.msg
                        });
                    }
                },
            );
        }
    }

    ngOnInit() {
    }

    submitForm(value){
        console.log(value);
    }

}

login.component.html

<eui-panel [title]="'Login Panel'" [collapsible]="true" [bodyStyle]="{padding:'20px'}" style="height:320px;width:400px; margin:auto;margin-top: 25vh">
        <h2>RUC SSO LOGIN</h2>
        <form novalidate #formm [formGroup]="loginForm" (ngSubmit)="submitForm(loginForm)">
            <div style="margin-bottom:10px;">
                <label [for]="t1" align="top">Username:</label>
                <eui-textbox #t1 formControlName="username" iconCls="icon-man" placeholder="username" style="width:100%"></eui-textbox>
            </div>
            <div style="margin-bottom:10px;">
                <label [for]="t2" align="top">Password:</label>
                <eui-passwordbox #t2 formControlName="password" placeholder="password" style="width:100%"></eui-passwordbox>
            </div>
            <div>
                <eui-linkbutton (click)="submitForm(loginForm)">Login</eui-linkbutton>
            </div>
        </form>
</eui-panel>

Как я могу вызвать запрос браузера?


person Ryan Arief    schedule 15.11.2018    source источник
comment
почему это (click)="submitForm(loginForm)"in eui-linkbutton? вы уже отправляете форму.   -  person Ali Shahbaz    schedule 15.11.2018
comment
нет, я просто копирую пасту с easyui (пример страницы). Я знаю, что это избыточно, но, поскольку у него такой же результат, я оставляю его как есть. почему-то я не могу отправить форму через событие щелчка, поэтому я вызываю функцию   -  person Ryan Arief    schedule 15.11.2018
comment
После успеха попробуйте перейти по другому URL-адресу.   -  person Ali Shahbaz    schedule 15.11.2018
comment
тогда я не могу реализовать одностраничное приложение с angular?   -  person Ryan Arief    schedule 15.11.2018
comment
Я имею в виду переход через Router к другому компоненту. Реализуйте маршрутизацию, затем перейдите. stackoverflow.com/questions/38131293/angular-2-router-navigate < / а>   -  person Ali Shahbaz    schedule 15.11.2018
comment
Я уже реализую это на this.global.loginCheck (); это моя предыдущая реализация, но дает мне тот же результат   -  person Ryan Arief    schedule 15.11.2018
comment
Боюсь, что это поведение браузера, я просто создал форму входа и нажал кнопку ввода с клавиатуры, сохранил запросы пароля. Я думаю, вам следует использовать кнопку, а не ссылку.   -  person Ali Shahbaz    schedule 15.11.2018
comment
Можете ли вы дать мне скрипку? Я попробую, если это работает, вы можете добавить в качестве ответа   -  person Ryan Arief    schedule 15.11.2018


Ответы (1)


Хорошо, вот я создал простой пример, протестированный на URL-адрес приложения stackblitz Firefox

и URL-адрес редактора stackblitz

введите здесь описание изображения

Изменить: вы используете easyui, это может быть проблемой с easyui, но сохраните подсказки пароля при отправке формы и переходе к другому компоненту.

person Ali Shahbaz    schedule 15.11.2018
comment
Да, это может быть проблемой в easyui, но я никогда не работал над этим, вы пытались удалить кнопку ссылки и добавить только простую кнопку html? Я работал над компонентами devextreme, и мне тоже приходило в голову. - person Ali Shahbaz; 15.11.2018
comment
да, я заменяю теги, упомянутые ранее, стандартными тегами HTML, и это работает. - person Ryan Arief; 15.11.2018
comment
(отредактировал первый комментарий) оказывается, что браузер не распознал теги ‹eui-textbox›, ‹eui-linkbutton› и ‹eui-linkbutton›, так как я использую easyui, текущая работа - использовать собственный ввод тегов на странице входа. Вы можете дополнить ответ, добавив эту информацию. спасибо за помощь, сэр .. - person Ryan Arief; 15.11.2018