I'm trying to pass the value from an that is displayed through an ng-repeat into a function in my controller. The value displays properly in the HTML but when I get over to the function it displays the AngularJS expression instead of the actual value.
The HTML is as follows:
<li ng-repeat="account in accounts | filter:accountQuery" ng-click="setDisplayedFilters('{{account.AccountId}}')">
<span>{{account.Name}}</span>
</li>
When I inspect the element inside of a browser (Chrome in this case) it displays the actual AccountId like it is supposed to.
The setDisplayedFilters function is as follows:
$scope.setDisplayedFilters = function(accountId){
alert(accountId);
$.each($scope.accounts, function(i, item){
if(item.AccountId == accountId)
{
alert("Selected Account Id: " + accountId + "Matching Id in accounts Array: " + item.AccountId);
}
});
};
The first alert in the javascript will execute and displays "{{account.AccountId}}". The second one won't because it's comparing {{account.AccountId}} against the actual account Ids. So what I'm wondering is, what am I missing that is causing angular to interpret the AngularJS expresion literally rather than the value that should go in it's place?