Простой трюк для импорта двух или более классов, если они используют одно и то же имя в Angular.
Требование:
Допустим, у меня есть два класса, которые используют одно и то же имя для обоих классов, как показано ниже в примере.
import {CommonClassName} from ‘../module1/CommonClassName’; import {CommonClassName} from ‘../module2/CommonClassName’;
В этом случае вы можете использовать as псевдоним, как указано ниже. Вы можете изменить AliasName по своему усмотрению.
import {CommonClassName} from ‘../module1/CommonClassName’; import {CommonClassName as AliasName} from ‘../module2/CommonClassName’; … //You can call particular class with AliasName, as given below. this.modelClass = new AliasName();
Если у вас длинные имена классов для вашего проекта, вы можете сократить его, используя псевдоним as.
Бинго! ???
Ты сделал это! Вы можете дать любое имя в псевдониме и использовать любой класс, если они имеют одно и то же имя!
Хотите узнать больше об операторе импорта Angular / Javascript?
Import является статическим, поэтому статическое выражение import используется для импорта живых привязок только для чтения, которые exported другим модулем.
Импортированные модули находятся в strict mode независимо от того, объявляете вы их как таковые или нет. Оператор import не может использоваться во встроенных сценариях, если такой сценарий не имеет type=»module». Импортированные привязки называются живыми привязками, потому что они обновляются модулем, экспортировавшим привязку.
Существует также функционально-подобный динамический import(), который не требует сценариев type=»module». Обратная совместимость может быть обеспечена с помощью атрибута nomodule в теге <script>.
Есть несколько разновидностей синтаксиса импорта.
import defaultExport from «module-name»; import * as name from «module-name»; import { export1 } from «module-name»; import { export1 as alias1 } from «module-name»; import { export1 , export2 } from «module-name»; import { foo , bar } from «module-name/path/to/specific/un-exported/file»; import { export1 , export2 as alias2 , […] } from «module-name»; import defaultExport, { export1 [ , […] ] } from «module-name»; import defaultExport, * as name from «module-name»; import «module-name»; var promise = import(«module-name»);
Объяснение
- defaultExport
Имя, которое будет относиться к экспорту по умолчанию из модуля. - имя-модуля
Модуль, из которого выполняется импорт. Часто это относительный или абсолютный путь к файлу .js, содержащему модуль. Некоторые составители пакетов могут разрешать или требовать использование расширения; проверьте свою среду. Разрешены только строки в одинарных и двойных кавычках. - name
Имя объекта модуля, которое будет использоваться как своего рода пространство имен при обращении к импорту. - exportN
Имя экспорта для импорта. - aliasN
Имена, которые будут относиться к именованному импорту.
Упрощение синтаксиса — чтобы его было легко запомнить.
1. Импортировать один экспорт из модуля
import {myExport} from ‘/modules/my-module.ts’;
2. Импортировать содержимое всего модуля
import * as myModule from ‘/modules/my-module.d.ts’;
3. Импорт нескольких экспортов из модуля
import {foo, bar} from ‘/modules/my-module.ts’;
4. Импортируйте экспорт с более удобным псевдонимом
import {reallyReallyLongModuleExportName as shortName} from ‘/modules/my-module.js’;
5. Переименовать несколько экспортов во время импорта
import { reallyReallyLongModuleExportName as shortName, anotherLongModuleName as short } from ‘/modules/my-module.js’;
6. Импортируйте модуль только из-за его побочных эффектов
import ‘/modules/my-module.js’;
Надеюсь, вы найдете ответ с хорошим объяснением и дополнительными знаниями об импорте. Прокомментируйте, работает ли это для вас или вы найдете эту статью полезной.
Ссылка:
[1] Сведения об импорте заявления — Разработчики Mozilla
Первоначально опубликовано в Импортировать несколько экспортированных классов в Angular Ракшитом Шахом (я)
Больше контента на plainenglish.io
Источник: