angular - TypeScript 找不到模块错误

Question

我正在尝试使用模板作为指令。为此，我正在尝试将其导入 (app.module.ts)。但我收到错误消息“TS2307:找不到模块”。谁能帮我解决这个错误。我还上传了一些图片。

//app.module.ts

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

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

import { ProductListComponent } from './products/product-list.component';


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

.....................................................

//product-list.component.ts

import {Component} from '@angular/core';
@Component({
    selector: 'pm-products',
    templateUrl: 'app/products/product-list.component.html'
})

export class ProductListComponent { }

.................................................

//app.component.ts

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

@Component({
    selector: 'pm-app',
    // not quotes for template
    template: ` 
    <div><h1> {{pageTitle}} </h1>
            <pm-products></pm-products>
    </div>`
})

export class AppComponent {
    pageTitle: string = 'ACME Product Management';
}

<!--
product-list.component.html
-->

<div class="panel panel-primary">
    <div class="panel-heading">
        Product List
    </div>
    <div class="panel-body">
        <div class="row">
            <div class="col-md-2">Filter By:</div>
            <div class="col-md-4">
                <input type="text" />
            </div>
        </div>
        <div class="row">
            <div class="col-md-6">
                <h3>Filtered By: </h3>
            </div>
        </div>
    </div>

    <div class='table-responsive'>
        <table class="table">
            <thead>
                <tr>
                    <th>
                        <button class="btn btn-primary">Show Image</button>
                    </th>
                    <th>Products</th>
                    <th>Code</th>
                    <th>Available</th>
                    <th>Price</th>
                    <th>5 Star Rating</th>
                </tr>
            </thead>
            <tbody>

            </tbody>
        </table>
    </div>
</div>

Answer 1

从您的屏幕截图看来，products 不在您的 app 文件夹中。它高一级，因此 typescript 编译器无法找到它。该问题应该通过将其移入 app 文件夹来解决。