Путь к ресурсам внутри пользовательского модуля - PullRequest
0 голосов
/ 18 февраля 2020

У меня есть модуль:

Obs .: Это не модуль root

my-module
├── components
|   └── my-component
|        └── my-component.html
└── images
    └── my-image.png

Я пытаюсь установить путь к «my-image.png» inside » my-component. html ".

Я уже пробовал следующие способы:


    img src="./images/my-image.png"
    img src="../images/my-image.png"
    img src="/images/my-image.png"

Но когда я обслуживаю свое приложение, angular разрешает мои пути к:


    localhost:4200/./images/my-image.png
    localhost:4200/../images/my-image.png
    localhost:4200/images/my-image.png

Я хочу, чтобы angular разрешил мой путь относительно модуля, в котором находится мой файл html. Как я могу это сделать?

Ответы [ 2 ]

0 голосов
/ 18 февраля 2020

Вы должны добавить папку изображений в ресурсы в вашем angular. json:

"assets": [
              "src/assets",
              "src/favicon.ico",
              {
                "glob": "*.{png,jpg,gif,svg}",
                "input": "src/app/path-to-your-module/images",
                "output": "your-module/images"
              }

            ],

Это соответствует всем файлам png, jpg, gif и svg в вашем каталоге изображений. И выводит их на your-module/images/. Чтобы использовать ваши изображения внутри вашего модуля, используйте:

<img src="your-module/images/your-image.png">

Используя объект вместо строки, вы можете указать выходной каталог. В противном случае вам придется использовать полный путь к вашему модулю в теге img.

0 голосов
/ 18 февраля 2020

Вы можете добиться этого, добавив путь в angular. json, как показано ниже

 "assets": [
              "src/favicon.ico",
              "src/assets",
              "my-module/images"
            ],

и в img попробуйте это

img src="images/my-image.png"

Надеюсь, что полезно

...