I've created a fiddle to see the current functionality that I'm trying to resolve.
http://jsfiddle.net/dxande6/DTsUr/ Not that when you click a button and then hit delete, it always shows HOME. I'm trying to get it to return the value of the button. Thank you for any assistance. On Friday, February 7, 2014 11:27:11 AM UTC-7, Vanya Dineva wrote: > > Hi Dean, > > try: > ng-click='deleteClicked(newPhoneButton)' > > instead of > ng-click='deleteClicked({{newPhoneButton}})' > > I would also take a look if you have a fiddle or plunk with your code. > > > > On Thursday, February 6, 2014 8:45:52 PM UTC-5, Dean Anderson wrote: >> >> >> Thank you in advance to anyone that can help. I'm getting REALLY >> frustrated trying to figure this problem out. >> >> I'm using ng-repeat in my html to display different types of phones. I >> use the "key" attribute to pass it into the directive. >> I've got an $observe in my directive to note any changes as it goes >> through ng-repeat. >> >> The ng-click in the template is giving me nightmares. >> >> I'm trying to get it so that when I click on the delete button in the >> popup, it gives me the value of the button (i.e. HOME, OFFICE, CELL, etc) >> Here is the resulting html: >> >> <phone-button key="Home"> >> <button class="rule-button home" id="rule-option-item">Home</button> >> <p id="p-rule-option-item" class="ng-binding">Home</p> >> <div data-attr="" style="display:none" id="rule-change-modal"> >> <button class="rule-change" data-attr="move">Move</button> >> <button ng-click="deleteClicked(Home)" class="rule-change" >> data-attr="delete">Delete</button> >> </div> >> </phone-button> >> >> Instead, I'm seeing this error in my browser: >> >> >> Token 'newPhoneButton' is unexpected, expecting [:] at column 17 of the >> expression [deleteClicked({{newPhoneButton}})] >> >> Here is examples of most of my code: >> ruleSet[0] >> Target [{name: HOME}, {name: OFFICE}] >> ruleSet[1] >> Target [{name: CELL}] >> ruleSet[2] >> Target [{name: WORK}] >> >> <div id="rule-bar" class="rule-bar"> >> <div class="rule-option" ng-repeat="targetItem in ruleSet.target"> >> <phone-button key='{{ targetItem.name }}'></phone-button> >> </div> >> >> $scope.newPhoneButton=""; >> >> app.directive('phoneButton', function($compile) { >> return { >> restrict: 'EAC', >> template: "<button id='rule-option-item' class='rule-button >> {{newPhoneButton | lowercase}}'>{{newPhoneButton}}</button><p >> id='p-rule-option-item'>{{newPhoneButton}}</p>" + >> "<div id='rule-change-modal' style='display:none' >> data-attr=''><button data-attr='move' >> class='rule-change'>Move</button><button data-attr='delete' >> class='rule-change' >> ng-click='deleteClicked({{newPhoneButton}})'>Delete</button></div>" , >> link: function(scope, elements, attrs) { >> attrs.$observe("key", function(key){ >> scope.newPhoneButton = key; >> }); >> >> elements.bind('click', function() { >> $compile($("#rule-change-modal").html())(scope); >> }); >> >> scope.deleteClicked = function(val) { >> alert(val); >> alert('deleteClicked'); >> } >> >> } >> } >> }); >> >> >> -- You received this message because you are subscribed to the Google Groups "AngularJS" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/angular. For more options, visit https://groups.google.com/groups/opt_out.
