时间戳

首页 > 解决方案 > 接口打字稿内的接口

angular - 接口打字稿内的接口

问题描述

我是 Angular 的新手，我试图用接口类产生一些结果。

export interface Header {
   parentTitles: string;
   childHeaders: ChildHeader[];
   titleIcon: string;
   url: string;
  }

export interface ChildHeader {
   childTitles: string;
   siblingHeaders: SiblingHeader[];
   icon: string;
   url: string;
 }


export interface SiblingHeader {
  siblingTitles: string[];
  icon: string;
  url: string;

}

在 comp.ts 文件上 

 headers: Header = [
   {
  parentTitles: 'Settings',
  childHeaders: ChildHeader = [{
    childTitles: 'General Setup',
    siblingHeaders: SiblingHeader = [{
      siblingTitles: ['Vessel', 'Port', 'Owner', 'Engine Type', 
    'Vessel Type'],
      icon: '',
      url: ''
    }],
    icon: '',
    url: 'home/general-setup'
      }]
   }

  ];

所以 ChildHeader 和 SiblingHeader 是未定义的，如何解决这个问题！。

谢谢！

标签： angulartypescript

解决方案

创建对象实例时，语法为propertName: value. 您不能将类型用作值。你得到的错误是，例如SiblingHeader被用作一个值，但它不是一个值——它是一个类型。

但是，由于您已经拥有header: Header，因此您已经将header对象声明为标头，这意味着它的childHeaders属性已经是 的数组ChildHeader，它们本身就是对象数组，其siblingHeaders属性为 的数组SiblingHeader。也就是说，您不需要属性在对象文字中具有类型，因为它们是从对象本身的类型派生的。

const headers: Header[] = [{
  parentTitles: 'Settings',
  childHeaders: [{
    childTitles: 'General Setup',
    siblingHeaders: [{
      siblingTitles: ['Vessel', 'Port', 'Owner', 'Engine Type',  'Vessel Type'],
      icon: '',
      url: ''
    }],
    icon: '',
    url: 'home/general-setup'
  }]
}];

推荐阅读