Загрузка изображений из внешней папки в компонент Angular 2 - PullRequest
Новая
       29

Загрузка изображений из внешней папки в компонент Angular 2

0 голосов
/ 12 сентября 2018

Я пытаюсь загрузить свой логотип в свой login.component.html, но он не может работать. Вот как мои папки структурированы. Я надеюсь, что вы можете помочь мне с этим.

введите описание изображения здесь

Ответы [ 4 ]

0 голосов
/ 12 сентября 2018

Попробуйте это - 

<img src="src/assets/img/logo.png">
0 голосов
/ 12 сентября 2018

Используйте стиль CSS, чтобы применить его к div. 

.logo {
    width: logowidthpx;
    height: logoheightpx;
    background-image: url('assets/img/logo.png');
}

и в вашем компоненте 

<div class="logo"></div>
0 голосов
/ 12 сентября 2018

Убедитесь, что базовая ссылка в файле index.html выглядит следующим образом: 

<base href="/">

и тогда вы сможете получить доступ к папке ресурсов следующим образом: 

<img src="assets/img/logo.png">

Также проверьте файл package.json и убедитесь, что папка assets правильно описана в вашем проекте, например: 

"projects": {
    "project-name": {
      "root": "",
      "sourceRoot": "src",
      "projectType": "application",
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            "outputPath": "dist",
            "index": "src/index.html",
            "main": "src/main.ts",
            "tsConfig": "src/tsconfig.app.json",
            "polyfills": "src/polyfills.ts",
            "assets": [
              "src/assets",
              "src/favicon.ico"
            ],
            ...

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

0 голосов
/ 12 сентября 2018

в login.component.html 

<img src="./assets/img/logo.png">

Вот и все!

...