#angular #typescript
#angular #typescript
Вопрос:
Я новичок в Angular 2. Недавно я следил за руководством YouTube по созданию приложения MEAN с нуля (оно также есть на github, введите описание ссылки здесь). Затем я попытался интегрировать его с шаблоном администратора bootstrap (введите описание ссылки здесь).
Здесь возникает проблема — при запуске самого проекта bootstrap admin template проблем нет. Затем я копирую папку «клиент» шаблона администратора в приложение MEAN и разрешаю зависимости с помощью npm install. Хотя у меня установлены все зависимости, visual studio code по-прежнему сообщает, что [ts] не может найти имя ‘$’ в chart.component.ts (в приведенной выше ссылке шаблона администратора начальной загрузки перейдите в /SB-Admin-BS4-Angular-2/src/client/app/dashboard/charts/chart.component.ts) (извините, что я не могу разместить более 2 ссылок)
var AreaChart: any = $(‘#area-диаграмма’);
При перекрестной ссылке на исходный рабочий шаблон администратора знак доллара «$» вводится как cssSelectorHelper в typescript.
Затем я попытался объявить следующее:
объявить var $: cssSelectorHelper;
Затем он сообщил, что [ts] Не может найти имя ‘cssSelectorHelper’. Это заставило меня подумать, что проблема может быть связана с тем, что cssSelectorHelper не распознается typescript.
Кто-нибудь может предложить, как это решить? (Я новичок во всем этом. Если приведенное выше объяснение не имеет смысла, пожалуйста, помогите также уточнить.)
Заранее спасибо.
Ответ №1:
Angular 2 — это фреймворк MVC
и MVVM
шаблон, в то время JQuery
как он немного функционален. Да, use может использоваться JQuery
в Angular 2, но в основном они этого не делают. Тем не менее, некоторые люди по-прежнему считают сложным написание директивы или компонента для каждого отдельного элемента.
Проблема здесь в том, что при импорте jquery
в HTML-файл с использованием тега script компилятор Angular 2 не знает об этом. Итак, вы должны каким-то образом сообщить компилятору, что jquery
он был импортирован. Некоторые люди просто включают declare var $: JQueryStatic
или что-то в этом роде. Но самый стандартный способ сделать это для jquery
и других библиотек — это ввести определенно типизированный файл с помощью ввода.
Во-первых, вы должны установить typings https://github.com/typings/typings затем найдите нужную вам библиотеку и установите ее определенно введенный файл.
Затем просто включите /// <reference path="path_to_jquery/jquery.d.ts" />
в начало вашего .ts
файла, и все готово! VSCode будет поддерживать intellisense и все другие материалы для вас!
Ответ №2:
$ в интерфейсной разработке обычно подразумевается для jQuery. Вам нужно будет добавить jQuery в качестве тега сценария и поместить
declare var $: any;
в верхней части вашего .ts
файла.
Имейте в виду, что смешивание Angular и jQuery не одобряется, лучшей практикой было бы реализовать то, что вы пытаетесь сделать, в самом Angular 2.
Комментарии:
1. Привет @Alexander, прежде всего, спасибо, что нашли время, чтобы помочь мне. действительно ценится. Я обновил свой вопрос с более подробной информацией. Я не уверен, почему код перед интеграцией работает нормально. Однако, пытаясь интегрироваться с приложением MEAN, я столкнулся с проблемой. Надеюсь, вы сможете помочь. Спасибо