Автозаполнение поиска Algolia в компоненте Angular Dart

Я пытаюсь реализовать функцию автозаполнения поиска Algolia в проекте Angular Dart.

Я могу заставить его работать, если помещаю поле поиска ввода на страницу индекса, но если я помещаю поле поиска в компонент, оно не работает.

См. Прилагаемый проект GitHub с описанием моих проблем.

Ссылка на репозиторий GitHub

Когда он загрузится, вы увидите два поля поиска, помеченных соответствующим образом.

Один из них работает, другой - нет.

Что мне нужно сделать, чтобы это поле поиска работало в компоненте?

Спасибо!!!

angular dart angular-dart algolia dart-js-interop

21.07.2018 01:11

Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest

В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...

Angular и React для вашего проекта веб-разработки?

Когда дело доходит до веб-разработки, выбор правильного front-end фреймворка имеет решающее значение. Angular и React - два самых популярных...

Эпизод 23/17: Twitter Space о будущем Angular, Tiny Conf

Мы провели Twitter Space, обсудив несколько проблем, связанных с последними дополнениями в Angular. Также прошла Angular Tiny Conf с 25 докладами.

Угловой продивер

Оригинал этой статьи на турецком языке. ChatGPT используется только для перевода на английский язык.

Мое недавнее углубление в Angular

Недавно я провел некоторое время, изучая фреймворк Angular, и я хотел поделиться своим опытом со всеми вами. Как человек, который любит глубоко...

Освоение Observables и Subjects в Rxjs:

Давайте начнем с основ и постепенно перейдем к более продвинутым концепциям в RxJS в Angular

200

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Я ничего не знаю об Algolia, но предполагаю, что это проблема времени.

Сценарий для инициализации поля поиска запускается до запуска приложения angular, поэтому Algolia не может найти ввод.

Вы можете сделать следующее:

Не запускайте JS-скрипт или инициализацию, пока компонент не будет полностью загружены. Использование ngOnInit и package: js для вызова инициализирующего сценарий
Или переродите поле ввода в самом компоненте. Загрузите это на главной странице с помощью сценария JS, а затем в компоненте с помощью dart: html найдите элемент и поместите его в нужное место в своем приложении.

Спасибо, Тед, я смог заставить его работать правильно с вашим первым предложением! Я отправил рабочий код в GitHub, если он кому-то нужен, но в конечном итоге я переместил весь javascript инициализации в функцию js в app.js, а затем использовал настраиваемое событие в ngOnInit для вызова этой функции js. Он работает отлично, большое спасибо за ваше руководство! Кроме того, я поддержал ваш ответ, но моей репутации еще недостаточно, чтобы она учитывалась!

— 21.07.2018 23:44

21.07.2018 20:48