帶有對象文字的Angular2初始化抽象類

Question

export abstract class GridColumn {
    public field?: string;
    public sortField?: string;
    public header?: string;
    public footer?: string;
    public sortable?: any = true;
    public editable?: boolean = false;
    public filter?: boolean = true;
    public filterMatchMode?: string = 'contains';
    public filterPlaceholder?: string;
    public style?: any;
    public styleClass?: string;
    public hidden?: boolean = false;
    public selectionMode?: string = 'multiple';
    public frozen?: boolean;
}

例如，執行此操作僅返回具有那些已定義屬性的對象。

private gridConf: GridColumn = <GridColumn>{
    field: "test2",
    header: "Test2",
    filter: true,
    filterMatchMode: "contains",
    filterPlaceholder: "Search from Test",
    sortable: true,
    selectionMode: "single"
};

我想要的是GridColumn類型的對象，它具有所有定義的屬性和所有默認值。
這不起作用：

private gridConf: GridColumn = GridColumn({
    field: "test2",
    header: "Test2",
    filter: true,
    filterMatchMode: "contains",
    filterPlaceholder: "Search from Test",
    sortable: true,
    selectionMode: "single"
});

構造函數會迫使我寫一個很長的代碼，而我總是必須按特定順序添加所有屬性。

最終目標將是使用具有以下所有順序的默認和/或定義屬性的類似內容：

private columns: Array<GridColumn> = [
    <GridColumn>{
        field: "test",
        selectionMode: "single",
        filter: true,
        filterMatchMode: "contains",
        filterPlaceholder: "Search from Test",
        sortable: true,
        header: "Test"

    },
    <GridColumn>{
        field: "test2",
        header: "Test2",
        filter: true,
        filterMatchMode: "contains",
        filterPlaceholder: "Search from Test",
        sortable: true,
        selectionMode: "single"
    }
];

我能找到的最接近的“ hack”是刪除摘要並添加，其中字段引用自身：

public constructor(
    fields?: GridColumn) {
    if (fields) Object.assign(this, fields);
}

Answer 1

這實際上是不可能的，但是我想您可以找到一種解決方法。 並不是說這是最佳做法，但是如果您真的想要它，這就是您可以做到的方式。 僅供參考，僅當在非抽象類上使用new GridColumn() ，才會初始化默認值：

網格列

export class GridColumn implements IGridColumn {

    public sortable: boolean = true;
    public editable: boolean = false;
    public filter: boolean = true;
    public filterMatchMode: string = 'contains';
    public hidden: boolean = false;
    public selectionMode: string = 'multiple';

    public field: string;
    public sortField: string;
    public header: string;
    public footer: string;
    public filterPlaceholder: string;
    public style: any;
    public styleClass: string;
    public frozen: boolean;

    constructor(data: IGridColumn = {}){
       Object.assign(this, data);
    }
}

IGridColumn

export interface IGridColumn {
    public field?: string;
    public sortField?: string;
    public header?: string;
    public footer?: string;
    public sortable?: boolean;
    public editable?: boolean;
    public filter?: boolean;
    public filterMatchMode?: string;
    public filterPlaceholder?: string;
    public style?: any;
    public styleClass?: string;
    public hidden?: boolean;
    public selectionMode?: string;
    public frozen?: boolean;
}

用法

private columns: Array<GridColumn> = [
    new GridColumn(<IGridColumn>{
        field: "test",
        selectionMode: "single",
        filter: true,
        filterMatchMode: "contains",
        filterPlaceholder: "Search from Test",
        sortable: true,
        header: "Test"

    }),
    new GridColumn(<IGridColumn>{
        field: "test2",
        header: "Test2",
        filter: true,
        filterMatchMode: "contains",
        filterPlaceholder: "Search from Test",
        sortable: true,
        selectionMode: "single"
    })
];

讓我再次強調，我認為這不是最佳做法。 甚至以I開頭的接口都被命名為：D