Typescript错误TS2420：类不正确地实现了接口。

Question

在构建我的应用程序时，我遇到了以下错误，这对我来说似乎很奇怪，因为已经声明了appName属性：

../src/app/app.service.ts中出错(30,14)：类'AppService'没有正确实现接口'InternalStateType'。在类型'AppService'中缺少属性'appName'。

app.service.ts

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

interface InternalStateType {
  [key: string]: any;
  appName: string;
  darkMode: boolean;
  defaultLang: string;
  topnavTitle: string;
  messagePanelOpen: boolean;
  sidenavOpen: boolean;
  sidenavMode: string;
  sidenavCollapse: boolean;
  pageFullscreen: boolean;
  pageFooter: boolean;
  initial: boolean
};


/**
 * App service
 */
@Injectable()
export class AppService implements InternalStateType {

  // Set your states default value.
  private state: InternalStateType = {
    appName: 'MyApp',
    darkMode: false,
    defaultLang: 'en',
    topnavTitle: 'MyApp',
    messagePanelOpen: false,
    sidenavOpen: false,
    sidenavMode: 'over',
    sidenavCollapse: true,
    pageFullscreen: false,
    pageFooter: false,
    initial: false
  };

  public cloneState(): InternalStateType {
    return JSON.parse(JSON.stringify(this.state));
  }

  public reloadState(state: InternalStateType) {
    this.state = state;
  }

  public getState(prop?: any): InternalStateType {
    const state = this.state;
    return state.hasOwnProperty(prop) ? state[prop] : state;
  }

  public setState(prop: string, value: any) {
    return this.state[prop] = value;
  }
}

我哪里错了？感谢您的反馈。

- user762579

---

如果您想实现该接口，必须直接在您的类上编写所有 InternalStateType 属性。 - Sebastian Sebald

谢谢，就这样了...你能回复一个答案让我投票吗？ - user762579

当然 :) 我稍微扩展了一下答案以便澄清。 - Sebastian Sebald

Answer 1

你定义的接口只有“直接属性”，但是实现InternalStateType接口的类中，InternalStateType的所有属性都是state属性的成员。

你需要从类中删除state属性。然后一切都应该正常工作 :)

- Sebastian Sebald

Answer 2

你在 AppService 类型上实际上没有 appName 属性。你的 state 是 InternalStateType 类型，并且有 appName 属性。如果你真的想让 AppService 实现 InternalStateType，那么请按照以下方式定义它：

@Injectable()
export class AppService implements InternalStateType {

  private appName: string;
  // ... define other members of `InternalStateType` here

}

如果您不打算让 AppService 实现 InternalStateType，请从类声明中将其移除：

export class AppService {
  // ...
}

- Saravana

---

感谢您的反馈...正如@sebastian所说，我在我的类中直接忽略了属性声明... - user762579