在 component.ts 文件的接口文件夹下找不到我的打字稿 属性

Question

我的代码是这样的：-

我在interface文件夹下创建了一个book.ts(属性)，我这里创建了一个book.ts file.but我的book.component.ts没有如果我在 book.component.ts 中使用接口 (book.ts)，请找到我的 book.ts property.but。然后它就可以工作 fine.but 我想将此界面 (book.ts) 保留在我的 component.ts 文件之外。我如何从我的组件访问它。

这是我的代码：-

app/interfaces/book.ts

interface Book
{
    id: number;
    title: string;
    description: string;
    author: string;
    rate?: number;
    dateStart?: Date;
    dateRead? : Date;
}

app/component/books.component.ts

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



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


export class BooksComponent implements OnInit {

  
  
  public books: Book[];

  constructor() { }

  ngOnInit(): void {
  }

}

当我 运行 我的 application.then 我发现这个错误:-

文件夹结构：-

我如何解决这个issue.please帮助。

更新

import { Component, OnInit } from '@angular/core';
import { Book } from '../interfaces/book'

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


export class BooksComponent implements OnInit {

  
  
  public books: Book[];

  constructor() { }

  ngOnInit(): void {
  }

}

export  interface Book
{
    id: number;
    title: string;
    description: string;
    author: string;
    rate?: number;
    dateStart?: Date;
    dateRead? : Date;
}

新错误：-

Answer 1

您没有在组件文件中导入 Book。

在book.ts

中添加export

export interface Book {
  // ...
}

并在组件文件中导入

import { Book } from '../../interfaces/book'
// other imports and code 

Answer 2

1. 将book.ts放入界面文件夹 接口书前写前缀导出。 示例语法

   export interface Book {}
   

2. 然后在 component.ts 文件中导入接口 示例语法

   import { Book } from './interfaces';