AngularJS ng-click inside ng-repeat

Question

I have a ng-click nested inside a ng-repeat, and I am trying to pass a value from the current item in the loop. If I inspect the html generated using Chrome developer tools it looks correct (&ID=1) but when I put a break point in the function it shows &ID={{d.ID}} as the value that gets passed to the function. Any help is appreciated.

<tr ng-repeat-start="d in data">
    </td>
    <td> 
        <a href="#" ng-click="openDialog(false,'http://portal.sharepoint.com/Lists/Organization/DispForm.aspx?IsDlg=1&ID={{d.ID}}')"> {{d.OrganizationName}}</a> 
    </td> 
</tr>

Have you tried to change ng-click for onclick? I think it will solve your problem — nanndoj
– nanndoj, Commented Jan 7, 2015 at 23:51

mia · Accepted Answer · 2015-01-08 07:24:02Z

2

Try it:

 <tr ng-repeat-start="d in data">
            </td>
            <td> 
                <a href="" ng-click="openDialog(false,'http://portal.sharepoint.com/Lists/Organization/DispForm.aspx?IsDlg=1&ID='
+d.ID)"> {{d.OrganizationName}}</a> 
            </td> 
        </tr>

answered Jan 8, 2015 at 7:24

mia

1,2481 gold badge12 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Stone · Accepted Answer · 2015-01-07 23:51:46Z

I would recommend passing the Id in as an attribute of the openDialog method and building the url string in the controller.

ng-click="openDialog(false,'http://portal.sharepoint.com/Lists/Organization/DispForm.aspx?IsDlg=1', d.ID)"

then build the string in the controller and perform your location change. Easier to debug and un-clutters the view.

you could also store this string in your controller 'http://portal.sharepoint.com/Lists/Organization/DispForm.aspx?IsDlg=1'

ng-click="openDialog(false, d.ID)"

nanndoj · Accepted Answer · 2015-01-07 23:53:20Z

ngClick directive will evaluate an expression. I guess it's not what you want

Try to change ng-click by simple onclick. It will solve your problem:

Change

 <a href="#" ng-click="openDialog(false,'http://portal.sharepoint.com/Lists/Organization/DispForm.aspx?IsDlg=1&ID={{d.ID}}')"> {{d.OrganizationName}}</a>

for

 <a href="#" onclick="openDialog(false,'http://portal.sharepoint.com/Lists/Organization/DispForm.aspx?IsDlg=1&ID={{d.ID}}')"> {{d.OrganizationName}}</a>

With ng-click. you don't need to use {{}} in order to get the variable value. Like in this sample from Angular Docs

<button ng-click="count = count + 1" ng-init="count=0">
  Increment
</button>
<span>
  count: {{count}}
</span>

Collectives™ on Stack Overflow

AngularJS ng-click inside ng-repeat

3 Answers 3

Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Related