如何自定义TFS工作项模板下拉框的数据源？

方法一：开发自定义控件扩展（实现实时动态数据源） #

这是实现接口驱动下拉框的标准方式，步骤如下：

• 1. 搭建开发环境：安装Node.js后，执行npm install -g yo generator-azure-devops安装扩展生成器
• 2. 初始化控件项目：运行yo azure-devops，选择「Work item form control」模板，按提示填写项目信息
• 3. 编写动态下拉逻辑：在控件代码里调用目标接口获取数据，渲染下拉选项，核心示例代码（TypeScript+React）：

  import * as React from 'react';
  import { IWorkItemFormControlProps } from 'azure-devops-extension-api/WorkItemTracking';
  
  export class DynamicDropdown extends React.Component<IWorkItemFormControlProps> {
      state = { options: [] };
  
      componentDidMount() {
          // 调用外部接口获取选项
          fetch('你的接口地址')
              .then(res => res.json())
              .then(data => {
                  const options = data.map(item => ({ 
                      value: item.id.toString(), 
                      label: item.displayName 
                  }));
                  this.setState({ options });
              });
      }
  
      render() {
          const { field } = this.props;
          const { options } = this.state;
          return (
              <select
                  value={field.value || ''}
                  onChange={(e) => field.setValue(e.target.value)}
              >
                  {options.map(opt => (
                      <option key={opt.value} value={opt.value}>{opt.label}</option>
                  ))}
              </select>
          );
      }
  }
  

• 4. 打包发布：执行npm run package生成.vsix文件，上传到Azure DevOps组织的扩展库
• 5. 关联工作项模板：在TFS工作项类型编辑页面，将目标字段的控件类型替换为你开发的自定义控件

方法二：REST API+全局列表同步（适合无前端开发场景） #

如果不需要实时数据，可通过脚本定期将接口数据同步到TFS全局列表，再绑定下拉框：

• 1. 创建全局列表：在TFS管理界面的「全局列表」中新建列表（比如DynamicDropdownOptions）
• 2. 编写同步脚本：调用接口获取数据后，通过TFS REST API更新全局列表，PowerShell示例片段：

  # 获取接口数据
  $apiResponse = Invoke-RestMethod -Uri "你的接口地址" -Method Get
  
  # 生成全局列表XML格式内容
  $globalListContent = @"
  <gl:GLOBALLISTS xmlns:gl="http://schemas.microsoft.com/VisualStudio/2005/workitemtracking/globallists">
      <GLOBALLIST name="DynamicDropdownOptions">
          $(foreach ($item in $apiResponse) {
              "<LISTITEM value=`"$($item.name)`" />"
          })
      </GLOBALLIST>
  </gl:GLOBALLISTS>
  "@
  
  # 更新TFS全局列表
  $tfsApiUrl = "http://你的TFS服务器地址/tfs/项目集合/_apis/wit/globallists/DynamicDropdownOptions?api-version=6.0"
  Invoke-RestMethod -Uri $tfsApiUrl -Method Put -ContentType "application/xml" -Body $globalListContent -UseDefaultCredentials
  

• 3. 绑定字段：将工作项下拉字段的「允许值」设置为该全局列表
• 4. 定时执行：用Windows任务计划或Linux cron定期运行脚本，同步数据

注意事项 #

• 自定义控件需适配TFS版本，确保权限配置正确
• 脚本同步方式存在数据延迟，适合实时性要求低的场景
• 接口需保证TFS服务器/客户端可访问，跨域场景需配置代理

内容的提问来源于stack exchange，提问作者豪杰邱