Существует какой-то способ выразить addeventlistener и getElementById в Angular7?

#javascript #typescript #angular7

#javascript #typescript #angular7

Вопрос:

Мне было интересно, существует ли какой-то метод или что-то еще, чтобы выразить метод addEventListener и getElementById в typescript, чтобы использовать его

Я не знаю, поможет ли мне использование хоста декоратора, я еще не пробовал, но я думаю, что это может быть возможным способом решения этой проблемы.

 const signUpButton = document.getElementById('signUp');
const signInButton = document.getElementById('signIn');
const container = document.getElementById('container');

signUpButton.addEventListener('click', ()=>
    container.classList.add('right-panel-active')
);

signInButton.addEventListener('click', ()=>
    container.classList.remove('right-panel-active')
);
 

Я просто хочу установить это в typescript.

Ответ №1:

Вы помещаете обработчик щелчков на кнопки и используете ngClass для добавления класса в контейнер.

 <button (click)="signUp()">Sign up</button>

<button (click)="signIn()">Sign in</button>

<div id="container" [ngClass]="{ 'right-panel-active': showPanel }"></div>
 

и в машинописном тексте

 showPanel = false;

signUp() {
  this.showPanel = true;
}

signIn() {
  this.showPanel = false;
}
 

Комментарии:

1. Вот демонстрация stackblitz.com/edit /…