Knockout JS calling ViewModel function in foreach binding

In a sense, your colleagues have a point of view. I wouldn't create a custom binding myself to handle this (in the ongoing subjective comments, custom bindings are better suited for this purpose if there is a special way of communicating between the view and the viewmodel; See this article for detailed instructions on how to use them).

On a side note, if we do explore a custom option for binding, I think you could do this with a textIfNotEmptybinding handler that combines textthe bindings visiblein one. On the other hand, if showNamethe functionality remains as-is, then you can also:

<span data-bind="visible: !!name, text: name"></span>

Anyway, I would like the following...

The underlying problem is IMO that the view model violates the single responsibility principle: showNamefunctionality should be the responsibility of the view model representing the item.

var Item = function(data) {
    var self = this;

    self.id = data.id;

    self.name = ko.observable(data.name); 
    // or plain "self.name = data.name;" if you don't need 2way binding

    self.showName = ko.computed(function() { 
         return self.name() && self.name().length > 0;
    });
}

Now you can easily bind like this:

<ul data-bind="foreach: items">
    <li><span data-bind="text: id"></span>
         <span data-bind="visible: showName">Yes! show the name</span>
         <a href="#" data-bind="click: $root.removePerson">Remove</a>
    </li>
</ul>

This also allows you to rewrite removePersonas:

viewModel.removePerson = function (person) {
    console.log(person); 
};

This does require you to do some extra work when building the observable array, but it's worth it because it clearly separates all the problems. It can be done as follows:

var viewModel = {
    items: ko.observableArray(data.map(function(item) { return new Item(item); }))
};

See this fiddle for the above example .