在knockout.js中，如何在“with”上下文中绑定选择列表？

我在以下JSFIDLE中重新创建了该问题：

HTML 当您从列表中选择一个人时，其姓名将显示在上方。我想添加一个下拉列表，允许您选择所选人员最喜欢的冰淇淋。我已经在html中注释了我所期望的工作

但是，它似乎没有使用options参数对象的上下文，而是使用父div的with参数的上下文

如何写入select标记以便绑定工作？

选项文本和选项值需要是字符串或函数。有关更多信息，请参阅

例如：

<h2>Edit Person Here</h2>
<div data-bind="with: EditPerson">
    <h3 data-bind="html: Name"></h3>
    <!--Uncomment line below to generate binding error. -->
    <!--<select data-bind="options:$parent.IceCreams, optionsText: Name, optionsValue: Id"></select>-->
</div>
<h2>List of People</h2>
<div data-bind="foreach: People">
    <div data-bind="click: $parent.SelectPerson">
        <h3 data-bind="html: Name"></h3>
        Favorite IceCream: <span data-bind="html: FavoriteIceCream().Name"></span>
    </div>
</div>

function ViewModel() {
     var self = this;

    self.IceCreams = ko.observableArray([
            new IceCream(1, "Chocolate"),
            new IceCream(2, "Vanilla"),
            new IceCream(3, "Mint")
        ]);
    self.EditPerson = ko.observable(new Person("", self.IceCreams()[0]));
    self.People = ko.observableArray([
            new Person("Joe", self.IceCreams()[2]),
            new Person("Sue", self.IceCreams()[0]),
            new Person("Carl", self.IceCreams()[1])
        ]);
    self.SelectPerson = function(person){
            self.EditPerson(person);
    }
}

function Person(Name, FavoriteIceCream){
    var self = this;
    self.Name = ko.observable(Name);
    self.FavoriteIceCream = ko.observable(FavoriteIceCream);
}

function IceCream(Id, Name){
    var self = this;
    self.Id = Id;
    self.Name = Name;
}

ko.applyBindings(new ViewModel());