0

我正面临下一个问题。我正在尝试使用一些模板创建一个指令，例如下面的示例：

 $templateCache.put("menuColumns.html",
       "<div id=\"grid-table\">"+
       "<table id=\"table-{{gridOptions.gridName}}\" class=\"table table-striped table-hover\" >" +
       "     <thead>"+
       "        <tr class=\"header cursor-hand\">"+
       "            <th ng-show=\"gridOptions.canDragDropRows\" style=\"width: 15px;\"></th>" +
       "            <th ng-repeat=\"itemColumn in gridOptions.gridColumnDefs \" " +
       "                ng-class=\"selectColumnStyle('{{itemColumn.field}}')\" >{{itemColumn.displayName}}</th>" +
       "            <th style=\"width: 50px;\"></th>"+
       "        </tr>"+
       "    </thead>"+
       "</table></div>"
   );

在我的控制器中，我有一个这样的变量：

 $scope.gridOptions = {
    canDragDropRows: true,
    gridName: 'items-list',
    gridColumnDefs: [{ field: "Id", width: "25%", displayName: "Id"},
                     { field: "Description", width: "25%", displayName: "Name" },
                     { field: "Location", width: "25%", displayName: "Installation" },
                     { field: "Equipment", width: "25%", displayName: "Equipment"}]
 };

正如您在模板内的 ng-class 中看到的那样，我正在尝试调用一个名为 selectColumnStyle 的函数，并且我需要将 {{itemColumn.field}} 的值作为参数传递。

当指令尝试渲染时，我没有得到那些具有 ng-class 的指令。似乎这不是将参数传递给某些函数的最佳方式。

你知道一种方法吗？这是我需要函数内字段的名称。

谢谢

4

2 回答 2

0

您不需要使用 {{ }}：

ng-class=\"selectColumnStyle(itemColumn.field)\" >{{itemColumn.displayName}}

于 2013-08-30T14:28:17.117 回答
0

在对我的代码进行了一些研究之后，（我已经尝试了 Mathew Berg 告诉我的内容）；我意识到其他东西正在改变我的指令。现在它在对代码进行一些更改后工作（但不是在我要求的代码部分）。

 $templateCache.put("menuColumns.html",
   "<div id=\"grid-table\">"+
   "<table id=\"table-{{gridOptions.gridName}}\" class=\"table table-striped table-hover\" >" +
   "     <thead>"+
   "        <tr class=\"header cursor-hand\">"+
   "            <th ng-show=\"gridOptions.canDragDropRows\" style=\"width: 15px;\"></th>" +
   "            <th ng-repeat=\"itemColumn in gridOptions.gridColumnDefs \" " +
   "                ng-class=\"selectColumnStyle('{{itemColumn.field}}')\" >{{itemColumn.displayName}}</th>" +
   "            <th style=\"width: 50px;\"></th>"+
   "        </tr>"+
   "    </thead>"+
   "</table></div>"

);

带有 {{ }} 的代码运行良好。如果有人需要，这就是jsFiddle ！

谢谢您的帮助！

于 2013-08-30T22:36:25.917 回答