Я пытаюсь написать форму входа/регистрации, в которой пользователь может переключаться между двумя формами (одновременно отображается только одна). Я использую простую кнопку, чтобы воспринимать изменения. Я написал это в простом html-файле, и он работает. Теперь я скопировал в свой проект Angular, и ничего не происходит.
Сначала я попробовал это (это в html-файле):
<script>
function showlogin() {
document.querySelector('#login').classList.remove("d-none");
document.querySelector('#register').classList.add("d-none");
}
function showregister() {
document.querySelector('#login').classList.add("d-none");
document.querySelector('#register').classList.remove("d-none");
}
</script>
Но затем я получил сообщение об ошибке, в котором говорится, что «Свойство 'showregister' не существует». Поэтому я удаляю код из html-файла и вставляю его в машинописный файл. Теперь я получаю новую ошибку «Объект, возможно, равен нулю».
Почему объект нулевой? Что я могу сделать, чтобы иметь доступ к кнопке и функции?
Я очень благодарен за любую помощь
Используйте угловой способ!
Код позади:
loginVisible: boolean = true;
...
function showLogin() {
loginVisible = true;
}
function showRegister() {
loginVisible = false;
}
И html-часть:
<div *ngIf = "loginVisible">Login Data</div>
<div *ngIf = "!loginVisible">Register Data</div>
Вот простой пример Stackblitz.
ngIf будет отображать компонент только в том случае, если условие истинно.