从$ .get分配KnockoutJS对象

时间:2013-02-12 10:01:03

标签: javascript knockout.js

我有以下代码和数据

{
    "Job": {
        "JobName": null,
        "JobNumber": 13,
        "JobSize": 0,
        "Status": "Finished",
        "DateCreated": "/Date(1312551946280)/"
    },
    "Values": [
        {
            "Id": "8401",
            "Status": "Good",
            "JobNumber": 13
        },
        {
            "Id": "8402",
            "Status": "Bad",
            "JobNumber": 13
        }
    ]
}

function JobViewModel() {
    var self = this;

    self.jobs = ko.observableArray();
    self.selectedJob = ko.observable();
    self.history = ko.observableArray();

    var app = Sammy(function () {
        this.get('#/:jobNumber', function (context) {
            $.get('/home/GetJobInfo/' + context.params.jobNumber, {}, self.selectedJob);
        });

    });

    jQuery(function () {
        app.run();
    });
}

我知道$ .get正在运行,因为我可以看到JSON数据返回,我在$ .get的第3个参数中使用了一个函数来查看数据。

当我用self.selectedJob属性替换该函数时,为什么它没有被填充?

由于

更新:这是我的HTML

<!DOCTYPE html>

<html>
<head>
    <link href="~/Content/main.css" rel="stylesheet" />
    <title>Sentinel Web Data</title>
</head>
    <body>
        <div id="sidebar">
            <ul data-bind="foreach: jobs">
                <li><a data-bind="text: $data.JobName, attr: { href: '#/' + $data.JobNumber}"></a></li>
            </ul>
        </div>
        <div id="job">
            <span data-bind="text: JobNumber"></span>
        </div>
        <div class="clear"></div>
        <div id="history"  data-bind="with: history"></div>
        <script src="~/Scripts/knockout-2.2.1.js"></script>
        <script src="~/Scripts/jquery-1.4.4.min.js"></script>
        <script src="~/Scripts/sammy-0.7.4.min.js"></script>
        <script src="~/Scripts/JobViewModel.js"></script>
        <script>
            ko.applyBindings(new JobViewModel());
        </script>
    </body>
</html>

当看到控制台中的get并在self.selectedJob.Job上观看时,我得到“未定义”

2 个答案:

答案 0 :(得分:0)

关于控制台,您正在错误地查看它。要查看所选的作业名称,您需要使用:

var vm = new JobViewModel();
ko.applyBindings(vm);

然后在控制台中:

vm.selectedJob().Job

对于与html的绑定,您没有绑定到所选作业:

<div id="job" data-bind="with: selectedJob">
    <span data-bind="text: JobNumber"></span>
</div>

答案 1 :(得分:0)

我已经成功通过这样做了但是我不确定为什么我的原始代码不起作用:

$.get('/home/GetJobInfo/' + context.params.jobNumber, {}, function (data) {
    self.selectedJob(data);
});