尝试学习Knockout并将其集成到ASP.NET Core应用程序中。这是我通过以下不同帖子得到的最远的:
function DayViewModel(number, name /*others*/)
{
this.dayNumber = number;
this.dayName = name;
//others
}
var MonthViewModel = function(days /*others*/)
{
this.monthDays = ko.observableArray(days);
}
$(function ()
{
var tempDays = [];
@foreach(var day in Model.Days)
{
string dayName = day.DayNumber.ToString().PadLeft(2, '0') + " - " + Globals.GetDayName(Model.YearNumber, Model.MonthNumber, day.DayNumber, Globals.GetUICulture(Context));
@:tempDays.push(DayViewModel(@day.DayNumber, "@dayName" /*others*/);
}
var monthViewModel = new MonthViewModel(tempDays /*others*/);
ko.applyBindings(monthViewModel);
});
然后,表格:
<table id="mTable" class="table">
<thead>
<tr>
<th>@Html.DisplayNameFor(model => newModel.DayNumber)</th>
</tr>
</thead>
<tbody data-bind="foreach: monthDays">
<tr>
<td>
<a href="#" data-bind="text: dayName"></a>
</td>
</tr>
</tbody>
</table>
这为数组中相同数量的项目正确生成<tr>
元素,生成的HTML向我显示tempDays
包含所有正确的项目。
为什么Knockout只重复最后一个元素呢?我在文档中找不到的错误是什么?
答案 0 :(得分:1)
您需要创建MonthViewModel
的新实例,否则this
会在每次调用时被覆盖,这会使最后MonthViewModel
更改所有人..
@:tempDays.push(new DayViewModel(@day.DayNumber, "@dayName" /*others*/);
这是一个没有Razor东西的小提琴:http://jsfiddle.net/LkqTU/32570/
答案 1 :(得分:-6)
如果你在angularjs中这样做,请使用ng-repeat而不是foreach。 您将在w3school中找到ng-repeat示例和语法。