CODEWITHSUNDEEP
angularjs
hardcore
hardcore

Reputation: 121

Angular expression inside ngclick not evaluating

I have a very simple problem.

I have a form with a button passing it as an object to a controller. Everything is working totally fine but the current name (by which it is currently passed) cannot stay and needs to be dynamic as I have multiple tabs and the names cant be the same for multiple forms.

So the problem. Name now, working: 

<form name="form" novalidate>
...
<button ... ng-click="Tab.validate.validate(form)">

Desired variant that does not work:

<form name="{{'form_' + tab.name}}" novalidate>
...
<button ... ng-click="Tab.validate({{'form_' + tab.name}})">

Form name in this case is properly 'form_tabName'. I use this expression syntax for id's and many other name elements to pre or suffix them in my code so its the ngclick side I'd like to change.

Error:

Error: [$parse:syntax] Syntax Error: Token '{' invalid key at column 37 of the expression [Tab.validate('form_' + {{tab.name}})] starting at [{tab.name}})].

Upvotes: 0

Views: 589

Answers (2)

Okazari
Okazari

Reputation: 4597

Here is a quick solution for you

  <form name="forms.form_{{tab.name}}">
    <button ng-click="Tab.validate(forms['form_'+tab.name])"></button>
  </form>

This will actually work (see it in this plunker)

Using a subobject (forms.xxx) you can access it using a string like with an array forms['form_'+tab.name]

Hope it helped.

Upvotes: 0

Agop
Agop

Reputation: 1917

The problem here is not the name attribute but the ng-click directive attribute. ng-click takes a JavaScript expression, not the Angular template tags ({{}}). Try this:

<button ... ng-click="Tab.validate('form_' + tab.name)">

Upvotes: 2

Related Questions