如何将选择框填充到jquery数据表?

时间:2015-02-10 07:56:32

标签: javascript jquery angularjs datatable

我使用的是jquery数据表和angularJS。

我有桌子

table#reception_issues.table.display(cellspacing='0', width='100%')
thead
tr
    th #
    th Date
    th Issue
    th Author
    th Support group
    th
    th
tfoot
tr
    th #
    th Date
    th Issue
    th Author
    th Support group
    th
    th

和数据表的脚本

script(type = 'text/javascript').
            $(document).ready(function () {
        $('#reception_issues').DataTable({
            "ajax": "http://localhost:4444/data2.json",
            "columns": [
                null,
                null,
                null,
                null,
                {
                    "data": null,
                    "defaultContent": "<select id='setGroupOfSupport' class='form-control' ng-model = 'selectedGsqroupOfSupport' ng-options = 'group as group.item_name for group in listOfGroupSupport'></select>"
                },
                {
                    "data": null,
                    "defaultContent": "<button ng-click='changeResponsibleGroupOfSupport' class='form-control btn btn-primary'>Change group</button>"
                },
                {
                    "data": null,
                    "defaultContent": "<button ng-click='acceptIssue' class='form-control btn btn-primary'>Accept</button>"
                }
            ]

        });
    });

和我的测试JSON文件

{
"data": [
    [
        "2346",
        "2015-20-03",
        "Issue 1",
        "Business 1"
    ],
    [
        "2545",
        "2015-20-01",
        "Issue 2",
        "Business 2",
    ],
    [
        "1235",
        "2015-20-02",
        "Issue 3",
        "Business 3"
    ],
    [
        "9800",
        "2015-20-04",
        "Issue 4",
        "Business 4"
    ]
]
}

SELECT框应包含一个列表:Business 1,Business 2等

我可以使用AngularJS填写选择框吗? 我如何填写选择框?

1 个答案:

答案 0 :(得分:0)

使用ng-repeat并查看docs

&#13;
&#13;
var myApp = angular.module('myApp',[]);

function MyCtrl($scope) {
  $scope.opts = [
    [
        "2346",
        "2015-20-03",
        "Issue 1",
        "Business 1"
    ],
    [
        "2545",
        "2015-20-01",
        "Issue 2",
        "Business 2",
    ],
    [
        "1235",
        "2015-20-02",
        "Issue 3",
        "Business 3"
    ],
    [
        "9800",
        "2015-20-04",
        "Issue 4",
        "Business 4"
    ]
  ];
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="myApp" ng-controller="MyCtrl">
  <select>
    <option ng-repeat="opt in opts">{{opt[3]}}</option>
  </select>
</div>
&#13;
&#13;
&#13;