如何从ko.computed中删除数组项

我有一个ko.computed，它可以删除已检查的项并将对象添加到数组中，现在我需要能够从另一个数组中存在的ko.computd中删除项。

因此，我有一个带有餐厅列表的模式对话框，当你选择餐厅的复选框时，它会被添加到self.selectedRestaurants，它的id会被添加至self.selectedRestaurantIDs。

selectedRestaurants被绑定到一个表，该表为每个被勾选的餐厅生成一行。selectedRestRestaurant表也有一个复选框，以便您可以选择要删除的项目。

问题是我不知道如何从选定的餐厅中删除项目，这是一个ko.computed可观察的问题。

简化JS

self.selectedRestaurantIDs     = ko.observableArray();
    self.selectedRecommendationIDs = ko.observableArray();
     self.selectedRestaurants = ko.computed(function() {
        return ko.utils.arrayMap(self.selectedRestaurantIDs(), function(id) {
            return ko.utils.arrayFirst(ko.toJS(self.restaurants), function(item) {
                return item.id == id; //selected id will be a string
            }); 
        });
    }); 
     self.selectedRecommendations = ko.computed(function() {
        return ko.utils.arrayMap(self.selectedRecommendationIDs(), function(id) {
            return ko.utils.arrayFirst(ko.toJS(self.selectedRestaurants), function(item) {               
                return item.id == id; //selected id will be a string                
            }); 
        });
    }); 

带绑定的HTML

<ul class="browse-restaurant-list" data-bind="foreach: $root.restaurants">
            <li>
                <div class="row">
                    <div class="col-md-1">
                        <input type="checkbox" data-bind="value: id, attr: {value: id}, checked: $root.selectedRestaurantIDs"/>
                    </div>
                    <div class="col-md-11">
                        <div class="row">
                            <div class="col-md-4">
                                <h4 data-bind="text: name"></h4>
                                <p class="restaurant-meta"><span>Type: <strong data-bind="text: foodType"></strong></span><span>Rating: <strong data-bind="text: rating"></strong></span></p>                               
                            </div>
                            <div class="col-md-3">
                                <span><strong>Hours</strong></span>
                                <p data-bind="foreach: $data.hoursOfOperation">
                                    <span class="hour-day" data-bind="text: day"></span>
                                    <span data-bind="text: open"></span>
                                    <span class="hour-open" data-bind="text: open_time"></span>
                                    <span class="hour-close" data-bind="text: close_time"></span><br/>
                                </p>                        
                            </div>
                            <div class="col-md-3">
                                <strong>Address</strong><br/>
                                <p data-bind="html: fullAddress"></p>                               
                            </div>
                            <div class="col-md-2">
                                <p><strong>Phone</strong><br/><span data-bind="text: phone"></span></p>                                                                                             
                            </div>
                        </div>
                    </div>
                </div>
            </li>
        </ul>
<tbody data-bind="foreach: $root.selectedRestaurants">
                    <tr>
                        <td><input type="checkbox" data-bind="value: id, attr: {value: id}, checked: $root.selectedRecommendationIDs"/></td>
                        <td data-bind="text: name"></td>
                        <td data-bind="text: foodType"></td>                                                
                        <td data-bind="html: fullAddress"></td>
                        <td data-bind="text: phone"></td>
                        <td data-bind="text: rating"></td>
                    </tr>                   
                </tbody>

最后我的removeSelected函数

self.removeSelected = function(item) {
        // remove all of the selected restaurant recommendations
        self.selectedRestaurants.remove(item);
     };