Show.bind / disabled.bind does not reflect changes all the time

Help Requests
1

Not sure why but I noticed that show / disabled binding does not update 100%. Is there a way to manually trigger binding re-evaluation?

2

I think they shouldn’t behave the way described. For me, they’ve been working perfectly fine. Probably there are some issues with value flowing into those bindings, it would be nice if you could give a reproduction of what issues you are having.

3

Here is my situation:

I need to enable / disable or show / hide a button in a child component based on a boolean property from parent component and a two-way bindable collection in the child component (does the collection have items or not).

In the child component, I display the collection two different ways using a value converter (collection | humanLabel and collection | machineLabel). The button should show if the parentComponent.canConfirm && childComponent.collection.any.

Note that the collection belongs to a property in the parent component and it is marked as bindable (two-way) in the child component. Make sense?

Parent component is a landing page from a route…

<child-component datasource.bind="myData" can-confirm.bind="canConfirm"></child-component>

In child component…

<button show.bind="canConfirm && datasource.length > 0"></button>

The button is toggled as long as there are some items in the datasource. I can remove / add and all its good. As soon as I remove all the items in the collection, then add another one, even though canConfirm is true and collection has some items, the button does not re-appear. It only happens some times. If I load a new object (in the parent component) then repeat the process, then the button toggles. Very weird as it only happens some times…

4

How are you clearing datasource? If you stonk over the collection object with a new one you are probably removing the observers, so the binding won’t know when you’re adding new items.

5

Oh good point. That might be my issue. Thanks =)

6

My issue was not caused by completely replacing the collection. The disabled logic was too involved in that it took a property from parent component and a property (collection) from child component. To fix it, I just made a computed property in the parent based on (canConfirm and datasource.length > 0). Now it works as expected. Thank you for your help =)