我按照这个方法使用VSS控件TreeView(在TFS2015.3上): https://www.visualstudio.com/en-us/docs/integrate/extensions/develop/ui-controls/treeviewo
但顶级节点显示奇怪的图标而不是节点名称(见图) result http://i67.tinypic.com/1zd1bbo.jpg
答案 0 :(得分:0)
按照您提供的说明,我没有看到任何问题。以下是我的HTML中的内容供您参考:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>EdControl</title>
<script src="sdk/scripts/VSS.SDK.js"></script>
</head>
<body>
<h1>EdControl</h1>
<div id="sample-container"></div>
<script type="text/javascript">
VSS.init({
// Our extension will explicitly notify the host when we're done loading
explicitNotifyLoaded: true,
// We are using some Team Services APIs, so we will need the module loader to load them in
usePlatformScripts: true,
usePlatformStyles: true
});
VSS.require(["VSS/Controls", "VSS/Controls/TreeView"],
function (Controls, TreeView) {
var container = $("#sample-container");
var source = [
{
name: "Asia", icon: "icon icon-people", children: [
{ name: "Russia" },
{ name: "Afghanistan" },
{ name: "India" },
{ name: "China" }]
},
{
name: "Africa", icon: "icon icon-people", children: [
{ name: "Algeria" },
{ name: "Botswana" },
{ name: "Cameroon" }]
},
{
name: "Europe", icon: "icon icon-people", children: [
{ name: "Germany" },
{ name: "Slovenia" },
{ name: "Belgium" },
{ name: "Luxembourg" },
{ name: "Turkey" }
],
expanded: true
}
];
// Converts the source to TreeNodes
function convertToTreeNodes(items) {
return $.map(items, function (item) {
var node = new TreeView.TreeNode(item.name);
node.icon = item.icon;
node.expanded = item.expanded;
if (item.children && item.children.length > 0) {
node.addRange(convertToTreeNodes(item.children));
}
return node;
});
}
// Generate TreeView options
var treeviewOptions = {
width: 400,
height: "100%",
nodes: convertToTreeNodes(source)
};
// Create the TreeView inside the specified container
Controls.create(TreeView.TreeView, container, treeviewOptions);
VSS.notifyLoadSucceeded();
});
</script>
</body>
</html>