相对路径在Angular2组件中不起作用 [英] Relative path is not working in Angular2 component

问题描述

徽标未在组件(导航栏)的Angular 2中加载

Logo not loading in Angular 2 in a component (Navbar)

import { Component, OnInit } from '@angular/core';
@Component({
  moduleId: module.id,
  selector: 'app-navbar',
  templateUrl: './navbar.component.html',
  styleUrls: ['./navbar.component.css']
})
export class NavbarComponent implements OnInit {

  private website:string
  private websiteUrl:string
  constructor() {  
    this.website = 'Rakesh'
    this.websiteUrl = 'http://google.com'
   }
  ngOnInit() {
  }

}

我在模板文件中添加了一些html代码，但徽标未加载

i add some html code in template file and the logo not loading

<div class="navbar-header">
  <a class="navbar-brand" href="{{websiteUrl}}">
  *<img src="./logo/rakesh.png" class="img-responsive" alt="Image">*
  </a>
</div>

控制台输出 moduleId should be a string in "NavbarComponent".

navabar.component.ts
logo/
    rakesh.png

推荐答案

问题可能来自moduleId should be a string in "NavbarComponent".

由于Angular CLI现在使用Webpack，因此Webpack中的module.id是一个数字，而Angular需要一个字符串.您应该做的是删除moduleId元数据.

As Angular CLI now use Webpack, module.id in Webpack is a number, while Angular expects a string. What you should do is remove the moduleId metadata.

@Component({
  selector: 'app-navbar',
  templateUrl: './navbar.component.html',
  styleUrls: ['./navbar.component.css']
})

这篇关于相对路径在Angular2组件中不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！