Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

can we define a variable when using containerless control flow syntax in knockoutjs #1002

Closed
Umar-Mukhtar opened this issue Jun 12, 2013 · 8 comments

Comments

@Umar-Mukhtar
Copy link

<script type="text/html" id="ListTemplate"> (at this point i want to keep the List in a variable to check on the next iteration)
  • ```
  • </script>
    @SteveSanderson
    Copy link
    Contributor

    I'm not sure what exactly you're asking for, but if you mean using the foreach binding, then yes you can:

    <!-- ko foreach: { data: people, as: 'person' } -->
        <span data-bind='text: person.name'></span>
    <!-- /ko -->
    

    @Umar-Mukhtar
    Copy link
    Author

    I want this:

    <!-- ko foreach: { data: people, as: 'person' } -->
    <!-- ko var strName = person.name } -->
    

    (i want this , how to accomplish it, i want to place the value in a variable and use further down)

    <!-- ko if: strName == person.name  } -->
        <span data-bind='text: person.name'></span>
    <!-- /ko -->
    

    @mbest
    Copy link
    Member

    mbest commented Jun 12, 2013

    Here's a binding I use:

    ko.bindingHandlers['let'] = {
        'init': function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
            // Make a modified binding context, with extra properties, and apply it to descendant elements
            var innerContext = bindingContext.extend(valueAccessor);
            ko.applyBindingsToDescendants(innerContext, element);
    
            return { controlsDescendantBindings: true };
        }
    };
    ko.virtualElements.allowedBindings['let'] = true;

    You can then use it like this:

    <!-- ko let: { strName: person.name } -->
    ...
    <!-- ko if: strName === person.name -->
        <span data-bind='text: person.name'></span>
    <!-- /ko -->
    ...
    <!-- /ko -->

    @Umar-Mukhtar
    Copy link
    Author

    Great, that is perfectly what i was looking for!

    @AllSeeingEye
    Copy link

    @mbest can this binding be implemented for Knockout 3.4+? I've seen several issues with it when I tried to use it in a real application (in particular, it didn't update the variable in some cases).

    @mbest
    Copy link
    Member

    mbest commented May 11, 2017

    It will be included in 3.5.0, whenever we manage to get that out. I just updated the comment above to use the latest version. The change was from var innerContext = bindingContext.extend(valueAccessor()); to var innerContext = bindingContext.extend(valueAccessor); (pass valueAccessor instead of calling it first).

    @AllSeeingEye
    Copy link

    @mbest Awesome, thank you for the quick answer! I'll try to test it shortly.

    @AllSeeingEye
    Copy link

    @mbest Just FYI, the above binding works & fixes all my issues. Thanks!

    Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
    Labels
    None yet
    Projects
    None yet
    Development

    No branches or pull requests

    4 participants