D3，Typescript和GraphNodes（打字稿界面中的可选字段）

Question

以下是定义在borisyankov/DefinitelyTyped中的D3.Layout.GraphNode和D3.Layout.GraphLink的定义。

export interface GraphNode { 
     id: number; 
     index: number; 
     name: string; 
     px: number; 
     py: number; 
     size: number; 
     weight: number; 
     x: number; 
     y: number; 
     subindex: number; 
     startAngle: number; 
     endAngle: number; 
     value: number; 
     fixed: bool; 
     children: GraphNode[]; 
     _children: GraphNode[]; 
     parent: GraphNode; 
     depth: number; 
    } 


    export interface GraphLink { 
     source: GraphNode; 
     target: GraphNode; 
    } 

但是，GraphNode不一定总是具有所有这些属性。例如，这里是一个GraphLink，其中一个source:GraphNode和一个target:GraphNode，它们都没有所有的属性。

此外，我不能有一个类，如：

class GraphData { 
    nodes: D3.Layout.GraphNode[]; 
    links: D3.Layout.GraphLink[]; 
} 

因为那时做这不起作用：

var data:GraphData = { 
    "nodes": [{ 
     "group": 0, 
     "id": 0 
    }, { 
     "group": 0, 
     "id": 1 
    }, { 
     "group": 0, 
     "id": 2 
    }], 
    "links": [{ 
     "source": 0, 
     "target": 2, 
     "value": 1 
    }, { 
     "source": 0, 
     "target": 0, 
     "value": 1 
    }, { 
     "source": 2, 
     "target": 1, 
     "value": 1 
    }, { 
     "source": 2, 
     "target": 1, 
     "value": 1 
    }] 
} 

的打字稿编译器给了我这个错误：

Compile Error. 
See error list for details 
C:/Projects/MyGraph/app.ts(111,23): error TS2082: Supplied parameters do not match any signature of call target: 

Types of property 'nodes' of types '{ "nodes": { "group": number; "id": number; }[]; "links": { "source": number; "target": number; "value": number; }[]; }' and 'GraphData' are incompatible: 

Type '{ "group": number; "id": number; }' is missing property 'index' from type 'D3.Layout.GraphNode'. 

解决此问题的一种方法是使接口GraphNode中的所有字段可选。但接口是没用的。 如何在这种情况下利用TypeScripts静态类型？

Answer 1

所有这些都不需要但也许一些是和接口定义不反映为呢。也许你可以标记哪些是社区支持的可选项。

无论如何。当你想对他人强制执行严格的行为，但想要灵活地打破你的自我，你可以使用任何。例如：

var data:GraphData = <any>{ 
    "nodes": [{ 
     "group": 0, 
     "id": 0 
    }, { 
     "group": 0, 
     "id": 1 
    }, { 
     "group": 0, 
     "id": 2 
    }], 
    "links": [{ 
     "source": 0, 
     "target": 2, 
     "value": 1 
    }, { 
     "source": 0, 
     "target": 0, 
     "value": 1 
    }, { 
     "source": 2, 
     "target": 1, 
     "value": 1 
    }, { 
     "source": 2, 
     "target": 1, 
     "value": 1 
    }] 
}