Friday 15 February 2013

javascript - KO Computed not updating UI -


I'm still quite new in knockout and I'm trying to display and hide the Bootstrap tab using Knockout .

Basically I have a calculable value:

  self.isActive = ko.computed (function () {var selected = ko.utils.arrayFirst (self. PadParticipant (), function (item) {return item.partition status == 'active';}); returns selected! == empty; truth: wrong;});   

To update these tabs:

  & lt; Ul class = "nav nav-tabs" id = "padTabs" & gt; & Lt; Li data-band = "fevable:! Active ()" & gt; & Lt; A href = "#Join Pin" & gt; Join the Pad & lt; / A & gt; & Lt; / Li & gt; & Lt; Li class = "active" & gt; & Lt; A href = "# History" & gt; History & lt; / A & gt; & Lt; / Li & gt; & Lt; Li data-band = "fevable: iactive ()" & gt; & Lt; A href = "#Update" & gt; Update subscription & lt; / A & gt; & Lt; / Li & gt; & Lt; / Ul & gt;   

The calculation is working correctly in the correct way that when I refresh the page the exact tab is hidden, but I need to work without getting refreshed.

What to do with understanding this issue when you use the observations calculated apart from this In the knockout framework, for the exploration array rules, first we see a note about the observation arrays:

Key point: An observation-array track, which is in the array of objects The state of those objects

Just put an object in an object and perform an overview Who sees himself the properties of that object. Of course, if you want, you can see these properties, but this is an independent option, an objective array only tracks the object that holds the object, and when the objects are added or removed, the listeners Indicates.

This is the same warning error that you are doing in this line of code, because it is not an overview, but an array of an object in the array: Return items Participation Status == 'Active';

In addition to this, we need to understand how calculable operation:

  • Whenever you declare a calculative calculation, Invites its evaluator ceremony to get its initial value.

  • When your evaluator is working, KO any overview (or overview of the calculation) < / Strong>

  • The evaluator has ended, KO sets a subscription for each supervision (or calculated observation) that you have touched < / Strong> Membership callback is set to replay your evaluator, looking back on the whole process at step 1 (any older Does not settle membership which is no longer applicable).

  • Informs someone about the new value of your computed observation.

    So when you created your calculable view, the only subscription created to look for a change was the viewable array self PadParticipant () .

    Since the state's UI relies on changing the Participation status , it means that this property should be an observation element within each object in the array, otherwise when this state If there is a change, then there will be no way for calculation to know about that change and update the UI.

  • No comments:

    Post a Comment