Question

我有一个新的Angular项目，只有一个组件，一个标题。标题中包含徽标图像。我在组件的构造函数中设置它：

export class AppHeader {
  logoImage: string;
  constructor() {
    this.logoImage = '/assets/images/logo.png';
  }
}

然后在模板中我<img [src]="logoImage" />。

现在我已经创建了一个包含此组件的模块，以便在 第二个 角项目中导出和使用：

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';

import { AppHeader } from './app-header.component';

@NgModule({
  imports: [
    CommonModule
  ],
  declarations: [
    AppHeaderComponent
  ],
  exports: [
    AppHeaderComponent
  ]
})
export class AppHeaderModule { }

这很有效，除了它没有带来图像。我还尝试直接在模板中引用图像，而不将其添加到.ts文件中，即仅<img src="assets/images/logo.png" />。

是否有一些我缺少的步骤或不同的导出技术来实现这一目标？

Answer 1

Per Pierre的建议，我没有尝试将图像与组件/模块一起导出，而是在第二个项目中更新了我的angular-cli.json来复制图像：

"assets": [
    "assets",
    "favicon.ico",
    {
      "glob": "**/*",
      "input": "../node_modules/base-project/src/assets/images",
      "output": "./assets/images"
    }
  ],

如何在Angular 2+中导出图像和模块？

1 个答案: