Knockout.js 剔除将选择列表映射到ViewModel

我正在进行我的第一个淘汰赛项目，需要一些指导。到目前为止，我可以从我的服务在视图模型中填充我的主类，但是我正在尝试绑定选择列表框，虽然数据可用，但控件没有像我预期的那样绑定。虽然我现在可以获取选择列表数据来填充表单，但它没有选择正确的索引

非常感谢您的关注

  // Initialized the namespace
    var Namespace = {};

    // View model declaration
    Namespace.initMemberVM = function (model) {
        var memberViewModel = {
            Id: ko.observable(model.Id),
            Married: ko.observable(model.Married),
            Name: ko.observable(model.Name),
            SalutationId : ko.observable(model.SalutationId),
            Salutation: ko.observable(Namespace.salutations[model.SalutationId]),
            Salutations: Namespace.salutations 
        };
        return memberViewModel;
    };

    Namespace.initSalutations = function (model) {
        console.log('called initSalutations');
        Namespace.salutations = ko.mapping.fromJS(model); 
    };


 // Bind the member
    Namespace.bindData = function (model) {
        // Create the view model
        var viewModel = Namespace.initMemberVM(model);

        ko.applyBindings(viewModel);
    };
    $(document).ready(function () {
        Namespace.getSalutations();
        Namespace.getMember(1);
    });

下面是从ajax调用返回的数据

[{"Id":1,"Name":"Mr","IsMarried":false,"TimeStamp":"2012-11-27T21:49:10.583"},{"Id":2,"Name":"Mrs.","IsMarried":true,"TimeStamp":"2012-11-27T21:49:10.583"},{"Id":3,"Name":"Ms","IsMarried":false,"TimeStamp":"2012-11-27T21:49:10.583"},{"Id":4,"Name":"Miss","IsMarried":false,"TimeStamp":"2012-11-27T21:49:10.583"}]

这是HTML

 <table>
        <tbody>
        <tr><td>User Id</td><td colspan="4"><label data-bind="text: Name"></label></td></tr>
        <tr>
        <td>Salutation</td><td><select   data-bind="options: Salutations, value: Id, optionsText: 'Name'"></select></td>
        </tr>
        <tr>
        <td></td><td>First</td><td>Middle</td><td>Last</td>
        </tr>
        <tr>
            <td>Name</td><td><input type="text" data-bind="value: FName"></td><td><input type="text"  data-bind="value: MName"></td><td><input type="text"  data-bind="value: LName"></td>
        </tr>


    </tbody>

用户Id
打招呼
第一中间层
名称

更新：进一步挖掘后，我发现select没有保存正确索引的原因是，当我尝试将该值设置为memberViewModel时，没有及时填充Namespace.sallations数组

---

任何关于如何管理的指导都将不胜感激

对于那些有类似问题的人，下面是您可能会发现有用的剩余代码位。。

  // Initialized the namespace
    var Namespace = {};

    // View model declaration
    Namespace.initMemberVM = function (model) {
        var memberViewModel = {
            Id: ko.observable(model.Id),
            Married: ko.observable(model.Married),
            Name: ko.observable(model.Name),
            SalutationId : ko.observable(model.SalutationId),
            Salutation: ko.observable(Namespace.salutations[model.SalutationId]),
            Salutations: Namespace.salutations 
        };
        return memberViewModel;
    };

    Namespace.initSalutations = function (model) {
        console.log('called initSalutations');
        Namespace.salutations = ko.mapping.fromJS(model); 
    };


 // Bind the member
    Namespace.bindData = function (model) {
        // Create the view model
        var viewModel = Namespace.initMemberVM(model);

        ko.applyBindings(viewModel);
    };
    $(document).ready(function () {
        Namespace.getSalutations();
        Namespace.getMember(1);
    });

同样，如果您在评论中遗漏了它，我会更新我对服务的第一次呼叫，以便为我的控制器以及我的成员带回数据。稍后我将调整此方法，以便分别存储参考数据供以后使用，但目前

 $.each(my.dataService.member.Salutations, function (i, p) {
                    salutations.push(new my.Dropdown(selectedItem)
                            .id(p.Id)
                            .name(p.Name)
                    );
                });


    // for creating Position Models
    my.Dropdown = function (selectedItem) {
        var self = this;
        self.id = ko.observable();
        self.name = ko.observable();
        // non-persitable properties
        self.isSelected = ko.computed(function () {
            return selectedItem() === self;
        });
    };

---

更新：我已经修改了我的方法，现在可以获取我的数据了，因为我在服务器端创建了一个ViewModel，用于返回我的主要对象和选择列表的支持数据。虽然这确实减少了调用的数量，但我还是想看看是否有人能解释如何执行多个ajax调用。另外，感谢史蒂夫的编辑！你能发布完整的源代码吗？我看不出getsaltations和getMember方法在做什么。样品最好。很高兴！这里是一个（大部分）工作代码的摆弄。我说的主要是b/c，尽管我可以填充我的下拉列表，正如您通过查看它们可以看到的那样，它们没有采用wijmo的任何样式。