Angular 属性 'content' 在类型 'never' 上不存在

Question

所以代码很简单，我有一个组件，我想在其中呈现信息（如果存在），当组件不存在时我得到错误。

所以 post-list.component.html 看起来像这样：

  <mat-expansion-panel *ngFor="let post of posts">
    <mat-expansion-panel-header>
      <mat-panel-title>
        {{ post.title }}
      </mat-panel-title>
      <!-- <mat-panel-description>
        {{post.description}}
      </mat-panel-description> -->
    </mat-expansion-panel-header>
    <p>{{ post.content }}</p>
  </mat-expansion-panel>
</mat-accordion>
<p *ngIf="posts.length >= 0">No posts added yet</p>

post-list.components.ts 看起来像这样>

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

@Component({
  selector: 'app-post-list',
  templateUrl: './post-list.component.html',
  styleUrls: ['./post-list.component.css'],
})
export class PostListComponent implements OnInit {
  constructor() {}

  posts = [];

  ngOnInit(): void {}
}

我收到这个错误： Error image

Answer 1

您没有为 posts 属性定义类型。当你做的时候

export class PostListComponent implements OnInit {
  ...
  posts = [];
  ...
}

typescript 从其值 [] 推导出 posts 属性的类型。从一个没有任何类型信息的空数组中它 decuces never[]，因此它假定以下

export class PostListComponent implements OnInit {
  ...
  posts: never[] = [];
  ...
}

要解决此问题，请为您的 posts 属性之类的

定义一个类型

export interface IPost {
  title: string;
  content: string;
  ...
}

export class PostListComponent implements OnInit {
  ...
  posts: IPost[] = [];
  ...
}

因此，typescript 将推断出正确的类型。

Answer 2

您只需正确输入 posts 属性:

interface Post {
  title:string;
  content: string;
}


export class PostListComponent {
  posts: Post[] = []; // <-- proper typings
}

Answer 3

在 VS 代码中只是给出错误，因为打字稿正在验证类型，angular 代码本身没有定义类型。

理想情况下，您可以在 PostListComponent 之外的某处定义 post 类型 class

export interface Post {
 title: string;
 content: string;
}

在您的 PostListComponent 中定义这样的类型

posts: Post[] = [];

Angular 属性 'content' 在类型 'never' 上不存在

Angular Property 'content' does not exist on type 'never'

javascript

angular

mean-stack