# Evaluate expression in dynamic UI composition

**URL:** <https://discourse.aurelia.io/t/evaluate-expression-in-dynamic-ui-composition/3198>\
**Category:** Help Requests\
**Created:** [January 28, 2020, 8:39am UTC](https://discourse.aurelia.io/t/evaluate-expression-in-dynamic-ui-composition/3198 "2020-01-28T08:39:01Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![PraveenGandhi](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/praveengandhi/32/1611_2.png) [@PraveenGandhi](https://discourse.aurelia.io/u/PraveenGandhi)\
**Post date:** [January 28, 2020, 8:39am UTC](https://discourse.aurelia.io/t/evaluate-expression-in-dynamic-ui-composition/3198/1 "2020-01-28T08:39:01Z")

</div>

Hi Team,

I am trying to use dynamic UI composition where I need to show or hide a composed element based on the expression (line number 20 in welcome.ts)in the JSON property. No luck. Please help.

 ![image](https://canada1.discourse-cdn.com/flex027/uploads/aurelia/original/2X/f/f92981bc2cd96c190c4bf70b4ef3c54ade3e83d8.png)

 ![image](https://canada1.discourse-cdn.com/flex027/uploads/aurelia/original/2X/b/bcbb2a1516994e93faa85f6498096cf4dd57e125.png)

---

<div class="post-metadata">

**Author:** ![jeffgrann](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/jeffgrann/32/43_2.png) [@jeffgrann](https://discourse.aurelia.io/u/jeffgrann)\
**Post date:** [January 28, 2020, 4:07pm UTC](https://discourse.aurelia.io/t/evaluate-expression-in-dynamic-ui-composition/3198/2 "2020-01-28T16:07:54Z")

</div>

I think you’ll need to use eval, like this:

```
show.two-way="!eval(item.show)"

```

Although using eval is almost always a bad idea.

---

<div class="post-metadata">

**Author:** ![PraveenGandhi](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/praveengandhi/32/1611_2.png) [@PraveenGandhi](https://discourse.aurelia.io/u/PraveenGandhi)\
**Post date:** [January 29, 2020, 11:33am UTC](https://discourse.aurelia.io/t/evaluate-expression-in-dynamic-ui-composition/3198/3 "2020-01-29T11:33:30Z")

</div>

@jeffgrann,

Thanks for responding, no luck with eval again. Trying with **Parser** from **aurelia-binding** , still struggling.

I am referring the below one

> [@Dynamic binding expression](https://discourse.aurelia.io/t/dynamic-binding-expression/1018):
>
> Following a great article by Ashley Grant ([https://blog.ashleygrant.com/2017/07/09/getting-my-hands-dirty-with-aurelias-binding-engine/](https://blog.ashleygrant.com/2017/07/09/getting-my-hands-dirty-with-aurelias-binding-engine/)) I tried to accomplist task for dynamic binding to expressions coming from my backend server as json. This approach works great until I tried to apply value converters to this rebased binding chain. After that it fails with error “Cannot read property ‘valueConverters’ of undefined”. My repro gist.run: [https://gist.run/?id=6e8a1ef7825abbfe1ec93242d1adcbbc](https://gist.run/?id=6e8a1ef7825abbfe1ec93242d1adcbbc) Coul…

---

<div class="post-metadata">

**Author:** ![PraveenGandhi](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/praveengandhi/32/1611_2.png) [@PraveenGandhi](https://discourse.aurelia.io/u/PraveenGandhi)\
**Post date:** [January 30, 2020, 2:53am UTC](https://discourse.aurelia.io/t/evaluate-expression-in-dynamic-ui-composition/3198/4 "2020-01-30T02:53:32Z")

</div>

Hi @ashley ,

I have followed [your blog](https://blog.ashleygrant.com/2017/07/09/getting-my-hands-dirty-with-aurelias-binding-engine/) for solving this. **DynamicExpressionBindingBehavior** saved me.

Thank you.

---

<div class="post-metadata">

**Author:** ![PraveenGandhi](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/praveengandhi/32/1611_2.png) [@PraveenGandhi](https://discourse.aurelia.io/u/PraveenGandhi)\
**Post date:** [January 30, 2020, 5:53am UTC](https://discourse.aurelia.io/t/evaluate-expression-in-dynamic-ui-composition/3198/5 "2020-01-30T05:53:13Z")

</div>

Hi Team,  
I am facing another problem, when the expression has a method call it is not updating. Please Help

for example:  
_**show: "questions[2].answer.indexOf(‘日産’) \>= 0"**_

Line 37 below

 ![image](https://canada1.discourse-cdn.com/flex027/uploads/aurelia/original/2X/6/6d8c7ef5bf2b9bd546faadde7fd49b5c40a06de5.png)

---

<div class="post-metadata">

**Author:** ![bigopon](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/bigopon/32/18_2.png) [@bigopon](https://discourse.aurelia.io/u/bigopon)\
**Post date:** [February 1, 2020, 11:36am UTC](https://discourse.aurelia.io/t/evaluate-expression-in-dynamic-ui-composition/3198/6 "2020-02-01T11:36:02Z")

</div>

what do you expect to be updated in this scenario? The parameter passed to the method `indexOf` is a literal string, means it will never change, so it shouldn’t update right?

---

<div class="post-metadata">

**Author:** ![PraveenGandhi](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/praveengandhi/32/1611_2.png) [@PraveenGandhi](https://discourse.aurelia.io/u/PraveenGandhi)\
**Post date:** [February 2, 2020, 12:49am UTC](https://discourse.aurelia.io/t/evaluate-expression-in-dynamic-ui-composition/3198/7 "2020-02-02T00:49:19Z")

</div>

@bigopon,

Let me share the exact use case and sample code with you for better understanding. Thanks for your support.

---

<div class="post-metadata">

**Author:** ![PraveenGandhi](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/praveengandhi/32/1611_2.png) [@PraveenGandhi](https://discourse.aurelia.io/u/PraveenGandhi)\
**Post date:** [February 2, 2020, 6:26am UTC](https://discourse.aurelia.io/t/evaluate-expression-in-dynamic-ui-composition/3198/8 "2020-02-02T06:26:53Z")

</div>

Hi @bigopon,

> **[Gitpod - Online IDE for GitHub](https://www.gitpod.io/#https://github.com/PraveenGandhi/survey-poc)**
>
> One-click ready-to-code development environments for GitHub.

> **[PraveenGandhi/survey-poc](https://github.com/PraveenGandhi/survey-poc)**
>
> survey-poc. Contribute to PraveenGandhi/survey-poc development by creating an account on GitHub.

Use case:

1. When first question answer is “red” third question is enabled to answer
2. third question answer decides 4th question should be enabled for answering or not (here I am struggling).

---

<div class="post-metadata">

**Author:** ![bigopon](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/bigopon/32/18_2.png) [@bigopon](https://discourse.aurelia.io/u/bigopon)\
**Post date:** [February 5, 2020, 11:47am UTC](https://discourse.aurelia.io/t/evaluate-expression-in-dynamic-ui-composition/3198/9 "2020-02-05T11:47:02Z")

</div>

I was able to make it work here [https://codesandbox.io/s/nostalgic-khorana-92uc0](https://codesandbox.io/s/nostalgic-khorana-92uc0)

There’s 2 key changes:

- you dont need to rebase the expression, you want to replace it instead
- you need to observe the array at `questions[2].answer`, as the mutation of that won’t trigger changes in the expression `questions[2].answer.indexOf('Nissan')`. To overcome this, I added an noop value converter to basically observe the array `questions[2].answer`, there’s other way to do it too.

Edit: you can also change the `&& questions[2].answer &&` to ` && questions[2].answer.length &&` so it can observe everything properly

---

<div class="post-metadata">

**Author:** ![PraveenGandhi](https://yyz1.discourse-cdn.com/flex027/user_avatar/discourse.aurelia.io/praveengandhi/32/1611_2.png) [@PraveenGandhi](https://discourse.aurelia.io/u/PraveenGandhi)\
**Post date:** [February 6, 2020, 1:52am UTC](https://discourse.aurelia.io/t/evaluate-expression-in-dynamic-ui-composition/3198/10 "2020-02-06T01:52:55Z")

</div>

@bigopon, Thank you very much for helping me. Learing new things, day by day.

Thank you,  
Praveen Gandhi.