我有一个 WPF 应用程序,我使用 ObservableCollection 在绑定的帮助下从 viewModel 刷新/更改/添加到视图。
现在我有使用 asp.net mvc 创建 Web 应用程序的额外要求
asp.net mvc 中的 ObservableCollection 有什么替代方法吗?
如果是这样,请用 jquery 和 razor 引擎(asp.net mvc)举一个很好的例子。
我有一个 WPF 应用程序,我使用 ObservableCollection 在绑定的帮助下从 viewModel 刷新/更改/添加到视图。
现在我有使用 asp.net mvc 创建 Web 应用程序的额外要求
asp.net mvc 中的 ObservableCollection 有什么替代方法吗?
如果是这样,请用 jquery 和 razor 引擎(asp.net mvc)举一个很好的例子。
不,没有。问题是在 Web 开发中没有使用这种意义上的事件。可能最接近可观察集合的方法是使用 ajax 从服务器请求 JSON 格式的列表并在客户端呈现该数据。通过巧妙地使用泛型、反射和一些 javascript,您或许可以将这段代码变得更加动态。
简单的例子:
控制器:
public JsonResult GetPersons()
{
var list = new List<string> { "Jake", "Jenny", "Joe" };
return Json(list, JsonRequestBehavior.AllowGet);
}
html:
<ul id='personlist'></ul>
查询:
$.getJSON('@Url.Action("GetPersons", "MyController")',null,
function (data) {
// iterate each person from the requested data
$.each(data, function (i, p) {
// render each person as li
$("#personlist").append('<li>'+p+'</li>');
});
});
另一个不那么动态的解决方案只是请求视图,使用 Viewmodel 和其中的人员列表。
public class PersonsViewModel
{
public List<string> Persons { get; set; }
public PersonsViewModel(List<string> persons)
{
Persons = persons;
}
}
public ActionResult Persons()
{
var list = new List<string> { "Jake", "Jenny", "Joe" };
return View(new PersonsViewModel(list));
}
看法:
<ul>
@foreach (var item in Model.Persons)
{
<li>@item.ToString()</li>
}
</ul>
如果你是 asp.net MVC 的新手,并且在我的提示之前一直在做 WPF/Winforms,那就是忘记你所知道的关于事件的一切。
首先阅读 sormii 的回答:Web 应用程序的生命周期不适合此类事件。您无法更新服务器上的某些内容(控制器或 Razor 代码)并期望在客户端 (HTML) 上刷新而无需往返。
正如 sormii 建议的那样,使用 Ajax 调用是继续的方法。如果您喜欢 MVVM 模式和 ObservableCollection 的工作方式,请查看knockoutjs。使用 knockoutjs,您可以声明包含视图中显示的所有数据的 javascript 视图模型(不要与服务器端 asp.net mvc 视图模型混淆)。此视图模型可以更新(使用 javascript 代码和 ajax 调用),并且 knockoutjs 将更新 DOM 以刷新值。
这是一个关于如何声明 javascript viewmodel 的小例子:
var ViewModel = function() {
this.items = ko.observableArray();
this.items.push({name: 'foo', lastName: 'bar'});
};
var vm = new ViewModel();
ko.applyBindings(vm);
淘汰视图模型只是 javascript 对象,它们的一些属性声明为 ko.observableArray 或 ko.observable(ko.observableArray 映射 ObservableCollection 和 ko.observable 映射引发 PropertyChanged 事件的属性)。然后您需要告诉 Knockout 如何将此视图模型绑定到 DOM 元素(例如在 WPF 和 DataTemplate 中使用 Binding 元素):
<li data-bind="foreach: items">
<ul data-bind="text: name" />
</li>
当调用 ko.applyBindings 时,Knockout 将<li>
在我们的视图模型的 items 属性中为每个项目创建一个元素。当从 items 属性中推送或删除项目时,剔除将自动更新列表。
继续查看 knockoutjs 网页,因为有很多示例和教程。