У меня есть файл js в моем приложении Angular, data.js. В этом js-файле объявлены некоторые переменные, как показано ниже.

 var data = 'test'

Теперь я должен получить доступ к этим переменным и их значениям в моем компоненте (app.component.ts).

Я читал кое-где, где они объявляются как экспорт, превращая их в модули, и к ним можно получить доступ где угодно, но я не уверен, как это можно сделать.

Это структура моего приложения. У меня есть data.js в папке assets-> js. Мне нужно изменить значение переменной в app.component.ts.

enter image description here

Я очень новичок в Angular. Это вообще возможно?

2
CrazyCoder 4 Мар 2018 в 08:09

3 ответа

Лучший ответ

С файлом в ваших активах, я предполагаю, что вы объявляете его в окне. Вам понадобится включить скрипт в ваш index.html, а затем получить к нему доступ в окне вашего компонента через window.data. Это действительно не рекомендуемый способ сделать это, если ваш сценарий использования не требует этого. Упомянутый вами модульный подход предпочтителен.

Рядом с вашим app.component.ts создайте файл с именем data.ts:

export let data: string = 'data';

В вашем app.component.ts импортируйте его, используя:

import { data } from './data.ts';

Если вы планируете не изменять эти данные, попробуйте вместо этого использовать ключевое слово const (в data.ts).

Структура каталога

/app.component.ts
/data.ts
/...

Изменить: Показать глобальный подход

Вам нужно будет включить ваш сценарий вне контекста приложения Angular. Если вы загрузили приложение с помощью Angular CLI, вы можете добавить ссылку на него в файле конфигурации cli. См. Эту документацию по теме.

Этот файл будет включен и будет доступен для доступа в вашем компоненте в окне. Сложная часть состоит из набора текста и окна. И пример может выглядеть так.

class AppComponent extends Component {

     private data: string;
     constructor() {
       // Explicitly cast window as an any type.  Would be better to type this, but this should work for you.
       this.data = (<any>window).data;
     }       

}
3
William Fleming 4 Мар 2018 в 06:38

Вы хотите, чтобы переменная была членом класса Component, а не просто переменной, объявленной где-либо внутри модуля.

Если это не имеет смысла сразу, вам нужно более внимательно взглянуть на некоторые базовые примеры кода на Angular.

Кроме того, если вы используете Angular и, следовательно, TypeScript, лучше объявлять переменные, используя let или const.

0
kshetline 4 Мар 2018 в 05:16

(ссылаясь на https://stackoverflow.com/a/42682160)


сначала , вы должны включить скрипт в src/index.html

Важно то, что вышеупомянутое утверждение помещено перед вашими угловыми корневыми компонентами (< root-component>< /root-component> или < ion-app>< /ion-app> или что-то в этом роде)

затем вы можете просто написать (например, внутри функции app.component.ts ngOnInit)

let varFromJsFile = window["data"] // varFromJsFile = 'test'
1
RBT 25 Фев 2020 в 07:28