Question

I’m trying to do the next thing:

<div data-bind="foreach: { data: elementsVM.elementsList, as: 'element' }">
   <div data-bind="with: new ElementViewModel(element).getElementDetailsByLang(langFilter)">
        <h3 data-bind="html: ElementTitle"></h3>
   </div>
</div>

The problem is that when with: new ElementViewModel(element).getElementDetailsByLang(langFilter) is called, the element that ends as parameter to ElementViewModel(Element) it’s the entire collection from the foreach binding (elementsVM.elementsList) instead of the current element from the foreach iteration.
elementsVM is an ElementsViewModel:

function ElementsViewModel() {
    var self = this;

    self.ElementsList = ko.observableArray();

    self.getElementsForCategory = function(categoryId) {
        [...]
    }
}

And the ElementViewModel looks like this:

function ElementViewModel(Element) {
    var self = this;

    self.ElementModel = new ElementModel(Element);

    self.getElementDetailsByLang = function (lang) {
        return ko.computed(function () {                
            [...]
        }
    }
}

Answer 1

What happens when you do:

<div data-bind="foreach: { data: elementsVM.elementsList }">
   <div data-bind="with: new ElementViewModel($data).getElementDetailsByLang(langFilter)">
        <h3 data-bind="html: ElementTitle"></h3>
   </div>
</div>

Your alternative is to use a custom binding, if that doesn’t work.