Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/404.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/4/json/13.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 使用$.getJSON获取时如何编辑ObservalArray数据?_Javascript_Json_Asp.net Mvc 4_Knockout.js - Fatal编程技术网

Javascript 使用$.getJSON获取时如何编辑ObservalArray数据?

Javascript 使用$.getJSON获取时如何编辑ObservalArray数据?,javascript,json,asp.net-mvc-4,knockout.js,Javascript,Json,Asp.net Mvc 4,Knockout.js,我对knockout.js还很陌生,但到目前为止我很喜欢它!我正在用MVC4写作,遇到了一点小麻烦。我已经让kojs停止使用静态数据,但我现在使用的是通过JSON从控制器传递的数据,不确定具体如何做到这一点 最初,我有一个活动“班”: function Activity(context) { var self = this; self.type = context.type; self.name = context.name; self.time = ko.obs

我对knockout.js还很陌生,但到目前为止我很喜欢它!我正在用MVC4写作,遇到了一点小麻烦。我已经让kojs停止使用静态数据,但我现在使用的是通过JSON从控制器传递的数据,不确定具体如何做到这一点

最初,我有一个活动“班”:

function Activity(context) {
    var self = this;
    self.type = context.type;
    self.name = context.name;
    self.time = ko.observable(context.time);
    self.product = context.product;
    self.item = context.item;
    self.itemAmount = context.itemAmount;

    self.formattedPrice = ko.computed(function () {
        var price = context.netPrice;
        return price ? "$" + price.toFixed(2) : "None";
    });
}
在my viewmodel中填充静态数据:

self.activities = ko.observableArray([
        new Activity({ type: 1, name: "John Smith", time: "1 hour", itemAmount: "5", netPrice: 232.16 }),
        new Activity({ type: 1, name: "Jane Doe", time: "2 hours", itemAmount: "7", netPrice: 4812.30 }),
        new Activity({ type: 1, name: "Clark Kent", time: "4 hours", itemAmount: "5", netPrice: 19.09 }),
    ]);
这很好,我可以使用ko.computed方法来改变我的数据。现在我正在提取数据,我将代码压缩为:

function ActivityViewModel() {
    var self = this;
    self.activities = ko.observableArray();
    $.getJSON("Home/ActivityData", self.activities);
}
这很好,在我的数据绑定字段中,我只是将文本调用从变量名转换为前面有$data的数据库记录名很酷很简单

问题是我有一个时间域,我需要通过moment.js“人性化”,所以问题是…我如何访问self.activies数据post JSON并编辑特定的域

很抱歉,如果这是一个简单的问题,但我没有运气在这件事上找到帮助(我可能没有在正确的地点寻找)。提前谢谢

更新
从服务器获取JSON'd的数据来自此LINQ查询:

var Data = from m in dataContext.Activities
                   select new 
                   { 
                       Type = m.Type,
                       ClientName = m.ClientName,
                       UserID = m.UserID,
                       ProductsNo = m.ProductsNo,
                       ProductName = m.ProductName,
                       NetPrice = m.NetPrice,
                       Time = System.Data.Linq.SqlClient.SqlMethods.DateDiffSecond(m.RecordCreated, DateTime.Now)
                   };

客户端需要做的是获取时间变量并在javascript中对其运行函数。我假设它是用ko.computed()函数完成的,但是我似乎不知道如何在时间变量被拉入self.activities后确定它的目标。

记住,Knockout是基于MVVM模式的(尽管我认为它会慢慢进入MV*)

您需要一个类模型。通常,模型中任何可能发生变化的项目都应该是可观察的。如果类型、名称、产品等。。。不会改变的,不要担心让它们被观察到,但是如果是的话,考虑更新它们。

function activityModel(context) {
    var self = this;
    self.type = ko.observable(context.type);
    self.name = ko.observable(context.name);
    self.time = ko.observable(context.time);
    self.product = ko.observable(context.product);
    self.item = ko.observable(context.item);
    self.itemAmount = ko.observable(context.itemAmount);

    self.formattedPrice = ko.computed(function () {
        var price = context.netPrice;
        return price ? "$" + price.toFixed(2) : "None";
    });
}
然后,在视图模型中,如果不使用映射库,则需要在成功返回AJAX调用时迭代结果并为每个结果创建一个对象(记住$.getJSON只是简写的AJAX)——

最后,您需要一个自定义绑定处理程序以可读的方式显示日期时间。您可以在查看模型之前注册它-

ko.bindingHandlers.DateTime = {
    update: function (element, valueAccessor) {
        var value = valueAccessor();
        var date = moment(value());
        var strDate = date.format('MMMM Do YYYY, h:mm:ss a');
        $(element).text(strDate);
    }
};
然后在你看来使用它-

<div data-bind="foreach: activities"> 
    <span data-bind="DateTime: time"></span>
</div>

记住,淘汰赛是基于MVVM模式的(尽管在我看来它会慢慢进入MV*)

您需要一个类模型。通常,模型中任何可能发生变化的项目都应该是可观察的。如果类型、名称、产品等。。。不会改变的,不要担心让它们被观察到,但是如果是的话,考虑更新它们。

function activityModel(context) {
    var self = this;
    self.type = ko.observable(context.type);
    self.name = ko.observable(context.name);
    self.time = ko.observable(context.time);
    self.product = ko.observable(context.product);
    self.item = ko.observable(context.item);
    self.itemAmount = ko.observable(context.itemAmount);

    self.formattedPrice = ko.computed(function () {
        var price = context.netPrice;
        return price ? "$" + price.toFixed(2) : "None";
    });
}
然后,在视图模型中,如果不使用映射库,则需要在成功返回AJAX调用时迭代结果并为每个结果创建一个对象(记住$.getJSON只是简写的AJAX)——

最后,您需要一个自定义绑定处理程序以可读的方式显示日期时间。您可以在查看模型之前注册它-

ko.bindingHandlers.DateTime = {
    update: function (element, valueAccessor) {
        var value = valueAccessor();
        var date = moment(value());
        var strDate = date.format('MMMM Do YYYY, h:mm:ss a');
        $(element).text(strDate);
    }
};
然后在你看来使用它-

<div data-bind="foreach: activities"> 
    <span data-bind="DateTime: time"></span>
</div>


您能制作一把小提琴来显示您的问题吗?不太好。无法从JSFIDLE上的服务器获取JSON数据。是的,您可以从许多源获取JSON数据。您还可以通过从functionCool返回JSON来伪造fiddle中的JSON调用,我不知道这一点。谢谢你能做一把小提琴来显示你的问题吗?不太好。无法从JSFIDLE上的服务器获取JSON数据。是的,您可以从许多源获取JSON数据。您还可以通过从functionCool返回JSON来伪造fiddle中的JSON调用,我不知道这一点。谢谢我有一种感觉,这是一种方式,但我希望有一种更优雅的方式来操纵可观测阵列(不使用模型)。哦,好吧,谢谢……这应该会有帮助的!如果您不想担心创建模型,请查看诸如Breeze.js或JayData@PWKad:
self.activities.push(新的activityModel(val))对吗?是的,我回答了你的问题,我认为它解决了你的问题。如果没有评论的话,我可以帮忙我有一种感觉,这是一种方式,但我希望有一种更优雅的方式来操纵一个可观察的数组(不使用模型)。哦,好吧,谢谢……这应该会有帮助的!如果您不想担心创建模型,请查看诸如Breeze.js或JayData@PWKad:
self.activities.push(新的activityModel(val))对吗?是的,我回答了你的问题,我认为它解决了你的问题。如果你不在那边评论,我可以帮你