kendo网格javascript中的模板错误无效

Question

我正在尝试使用表格和javascript生成一个kendo网格。生成的实际表格很好，但它输出了这个令人讨厌的错误，我想知道是否有办法解决它。

我的表格代码如下：

<table id="hoursdetail-table">
        <thead>
        <tr>
            <th>Employee ID</th>
            <th>Employee Name</th>

                @foreach (var header in ViewBag.ColumnTitle)
                {
                        <th>@header</th>
                }
        </tr>
        </thead>
        <tbody>
            @foreach (var emp in Model)
            {
                <tr>
                    <td>@emp.EmployeeID</td>
                    <td>@emp.EmployeeName</td>
                    <td>@emp.HoursAmount1</td>
                    <td>@emp.HoursAmount2</td>
                    <td>@emp.HoursAmount3</td>
                    <td>@emp.HoursAmount4</td>
                    <td>@emp.HoursAmount5</td>
                    <td>@emp.HoursAmount6</td>
                    <td>@emp.HoursAmount7</td>
                    <td>@emp.HoursAmount8</td>
                    <td>@emp.HoursAmount9</td>
                    <td>@emp.HoursAmount10</td>
                    <td>@emp.HoursAmount11</td>
                    <td>@emp.HoursAmount12</td>
                </tr>
            }

        </tbody>
    </table>

生成表格的javascript：

$(document).ready(function() {
        var grid = $("#hoursdetail-table").kendoGrid({
            dataSource: {
                pageSize: 15
            },
            sortable: true,
            pageable: true,
            filterable: true,
            groupable: true,
            scrollable: false,
            resizable: true
        }).data("kendoGrid");            
    });

问题似乎出现在foreach中。如果我删除它，表生成没有错误，但显然缺少标题。 ViewBag.ColumnTitle从控制器发送，如下所示：

var columnTitles = 
"01-2015,02-2015,03-2015,04-2015,05-2015,06-2015,07-2015,08-2015,09-2015,10-2015,11-2015,12-2015";
var values = columnTitles.Split(',');
ViewBag.ColumnTitle = values;

我无法弄清foreach导致问题的原因。这是错误

Uncaught Error: 
Invalid template:'<tr data-uid="#=data.uid#" role='row'><td  role='gridcell'>#=data.EmployeeID==null?'':data.EmployeeID#</td><td  role='gridcell'>#=data.EmployeeName==null?'':data.EmployeeName#</td><td  role='gridcell'>#=data.012015==null?'':data.012015#</td><td  role='gridcell'>#=data.022015==null?'':data.022015#</td><td  role='gridcell'>#=data.032015==null?'':data.032015#</td><td  role='gridcell'>#=data.042015==null?'':data.042015#</td><td  role='gridcell'>#=data.052015==null?'':data.052015#</td><td  role='gridcell'>#=data.062015==null?'':data.062015#</td><td  role='gridcell'>#=data.072015==null?'':data.072015#</td><td  role='gridcell'>#=data.082015==null?'':data.082015#</td><td  role='gridcell'>#=data.092015==null?'':data.092015#</td><td  role='gridcell'>#=data.102015==null?'':data.102015#</td><td  role='gridcell'>#=data.112015==null?'':data.112015#</td><td  role='gridcell'>#=data.122015==null?'':data.122015#</td></tr>' Generated code:'var $kendoOutput, $kendoHtmlEncode = kendo.htmlEncode;with(data){$kendoOutput='<tr data-uid="'+(data.uid)+'" role=\'row\'><td  role=\'gridcell\'>'+(data.EmployeeID==null?'':data.EmployeeID)+'</td><td  role=\'gridcell\'>'+(data.EmployeeName==null?'':data.EmployeeName)+'</td><td  role=\'gridcell\'>'+(data.012015==null?'':data.012015)+'</td><td  role=\'gridcell\'>'+(data.022015==null?'':data.022015)+'</td><td  role=\'gridcell\'>'+(data.032015==null?'':data.032015)+'</td><td  role=\'gridcell\'>'+(data.042015==null?'':data.042015)+'</td><td  role=\'gridcell\'>'+(data.052015==null?'':data.052015)+'</td><td  role=\'gridcell\'>'+(data.062015==null?'':data.062015)+'</td><td  role=\'gridcell\'>'+(data.072015==null?'':data.072015)+'</td><td  role=\'gridcell\'>'+(data.082015==null?'':data.082015)+'</td><td  role=\'gridcell\'>'+(data.092015==null?'':data.092015)+'</td><td  role=\'gridcell\'>'+(data.102015==null?'':data.102015)+'</td><td  role=\'gridcell\'>'+(data.112015==null?'':data.112015)+'</td><td  role=\'gridcell\'>'+(data.122015==null?'':data.122015)+'</td></tr>';}return $kendoOutput;'