Question

当我尝试将一个简单的表组件嵌套到另一个组件时，不能解决这个问题。当我在vs代码中编译文件时，这就是问题。

./src/app/employee/employee.component.ts中的错误找不到模块：错误：无法解析＆＃39; ./ app / employee / employee.component.html＆＃39; in＆＃39; C：\ Users \ Ani \ Desktop \ Training \ Angular \ my-first-project \ src \ app \ employee＆＃39;。

当我在@NgModule中添加EmployeeComponent时会发生这种情况。

这是我的代码： App.component.ts

   import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  template: `<div>
                <h1>{{pageHeader}}</h1>
              </div>`,
  styleUrls: ['./app.component.css']
})

export class AppComponent {
  pageHeader: String = 'Employee-Details';
}

App.module.ts

 import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';


import { AppComponent } from './app.component';
import { EmployeeComponent } from './employee/employee.component';


@NgModule({
  declarations: [AppComponent, EmployeeComponent],
  imports: [
    BrowserModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Employee.component.ts

  import { Component } from '@angular/core';

@Component({
    selector: 'app-employee',
    templateUrl: 'app/employee/employee.component.html'

})


export class EmployeeComponent {
    firstName: String = `Ani`;
    lastname: String = `master`;
    age: Number = 25;
    gender: String = `Male`;
}

Employee.component.html

    <table>
    <tr>
        <td>First Name</td>
        <td>{{firstName}}</td>
    </tr>

    <tr>
        <td>Last Name</td>
        <td>{{lastName}}</td>
    </tr>

    <tr>
        <td>Age</td>
        <td>{{age}}</td>
    </tr>

    <tr>
        <td>Gender</td>
        <td>{{gender}}</td>
    </tr>
</table>

Answer 1

尝试更改模板的绝对路径或添加相对路径。如果它们处于同一级别，例如

@Component({
    selector: 'app-employee',
    templateUrl: './employee.component.html'
})

嵌套组件未找到模块

1 个答案: