【问题标题】:How to declare an interface above an angular component?如何在角度组件上方声明接口?
【发布时间】:2017-01-09 14:37:32
【问题描述】:

我有一个带有从表单接收值的方法的组件。 我想用一个接口来描述表单数据。

但是,在运行时 (ng serve),编译器告诉我接口未知。 (Public property 'friendshipFormModel' of exported class has or is using private name 'IFriendshipFormModel'.)

如何正确声明接口?如果可能的话,我会避免只为这个接口创建一个单独的文件,因为它属于组件。

文件:

import { Component, OnInit, Output, EventEmitter } from '@angular/core';
import * as moment from 'moment';
import { FriendshipModel } from '../models/friendship.model';

interface IDatePickerDateModel {
    day: string;
    month: string;
    year: string;
    formatted: string;
    momentObj: moment.Moment;
}

interface IFriendshipFormModel {
    name: string;
    meetingDate?: IDatePickerDateModel;
}

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

export class CreateFriendshipComponent {
    @Output() friendshipCreated = new EventEmitter<FriendshipModel>();
    friendshipFormModel: IFriendshipFormModel;

    constructor() {
        this.friendshipFormModel = {
            name: '',
            meetingDate: null
        };
    }

    createFriendship() {
        const friendshipCreation: FriendshipModel = this.frienshipFactory(this.friendshipFormModel);
        this.friendshipCreated.emit(friendshipCreation);
    }
}

谢谢!

【问题讨论】:

    标签: angularjs typescript


    【解决方案1】:

    在这种情况下,也只需导出接口

    export interface IDatePickerDateModel {
        day: string;
        month: string;
        year: string;
        formatted: string;
        momentObj: moment.Moment;
    }
    
    export interface IFriendshipFormModel {
        name: string;
        meetingDate?: IDatePickerDateModel;
    }
    

    【讨论】:

    猜你喜欢
    • 2014-03-28
    • 2019-02-15
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-02-16
    • 1970-01-01
    • 1970-01-01
    • 2018-01-19
    相关资源
    最近更新 更多