Как получить доступ к элементу DOM в AngularJS

Question

Я новичок в AngularJS.У меня есть приложение с базовой маршрутизацией и т. Д., Но я бы хотел добавить скрипт, который добавит интерактивности моему домашнему экрану.Это сценарий js для пишущей машинки:

const texts = ['123', '456', '789'];
let count = 0;
let index = 0;
let currentText = '';
let letter = '';

(function type() {
  if (count === texts.length) {
    count = 0;
  }
  currentText = texts[count];
  letter = currentText.slice(0, ++index);

  document.querySelector(".typing").innerHTML = letter;
  angular.element(document.querySelector('.typing'));

  if (letter.length === currentText.length) {
    count++;
    index = 0;
  }
  setTimeout(type, 400);
})();

Это работает локально, но при развертывании в Heroku он говорит:

Uncaught TypeError: Невозможно установить свойство 'innerHTML' для null

Это говорит мне о том, что скрипт выполняется до загрузки представления домашней страницы.Каково лучшее решение для этого.Могу ли я вставить этот код в app.js, и если да, то как мне это сделать?

Я уже пытался обернуть свой код в window.onload, и это не имело никакого значения.

Answer 1

Во-первых, в angularjs скрипты помещаются в контроллер / сервис / фабрики, которые должны быть зарегистрированы в модуле вашего приложения.

Проверьте ниже учебник https://www.w3schools.com/angular/angular_controllers.asp