Just starting to explore the world of angularJS.
Running into a little hiccup while experimenting with ng-repeat. Here's the code snippet causing me trouble:
<ul class="dropdown-menu" role="menu" ng-init="names=findDomains()">
<li><a style="cursor:pointer" ng-repeat="x in names" ng-click="selectDomain({{ x }})">{{ x }}</a></li>
</ul>
The concept is simple - I have a drop-down menu on my web page, let's call it "test". When clicked, it shows various options listed inside <li></li> tags. All these options are fetched by the function findDomains() and initialized using ng-init.
Upon selecting a specific option (for example, "opt1"), the text of the drop-down should be updated to display the selected option ("opt1" instead of "test"). The magic happens through the use of the selectDomain() function.
To achieve this functionality, I tried calling {{x}} twice within the ng-repeat loop thinking that by clicking on an option, the respective selectDomain() would get triggered.
However, despite everything else working perfectly fine (findDomains(), ng-repeat, and the second {{x}} outside the <a></a> tags), the {{x}} inside the <a></a> doesn't seem to function as expected. Clicking on options doesn't update the drop-down menu text.
Interestingly, the selectDomain() function works flawlessly when called with plain text (e.g., ng-click="selectDomain('opt1')).
Any suggestions or advice on how to address this issue?