angular typescript 接口(interface)默认值

Question

我的界面:

export interface MapMarker{
    longitude: number,
    latitude: number,
    popupText: string
}

我的组件

mapMarker: MapMarker;

ngOnInit() {
    this.mapMarker.latitude = location.coords.latitude;
    this.mapMarker.longitude = location.coords.longitude;
    this.mapMarker.popupText = "Your current Location"
  }

这告诉我不能设置未定义的纬度。我知道为什么会这样。这是因为 mapMarker 有一个 MapMarker 类型但未定义，因为默认情况下它是未定义的。我应该怎么办？如果我尝试 mapMarker: MapMarker = null; 仍然是错误的。

我还尝试了 mapMarker: MapMarker = {}; 这给了我以下错误 = Type '{}' is missing the following properties from type 'MapMarker': longitude, latitude, popupText

我需要解决方案，但我不想使用“任何”类型。

Answer 1

如果您不想每次都创建一个对象并分配默认值，请改用一个为其属性设置默认值的类。如果您不指定值，将根据您的属性类型使用默认值。

export class MapMarker {
    longitude: number = 0;
    latitude: number = 0;
    popupText: string = '';
}

然后您可以简单地创建您的类的一个实例，每个字段都将被正确初始化:

mapMarker: MapMarker = new MapMarker();

如果你想保留你的接口(interface)，只需在类中实现它:

export interface IMapMarker {
    longitude: number;
    latitude: number;
    popupText: string;
}

export class MapMarker implements IMapMarker {
    longitude: number = 0;
    latitude: number = 0;
    popupText: string = '';
}

如果您的某些属性是可选的，请为它们使用可选运算符:

export interface IMapMarker {
    longitude?: number;
    latitude?: number;
    popupText?: string;
}

但是，在使用它之前，您始终必须确保该属性不为 null。