0

I am trying to create a directive for a dropdown group.
However, the data-binding does not work properly.
The problem is: the default variable does not receive value from html, and the item value could not be loaded as well.

Here is the directive code:

app.directive 'addquestionbutton', ()->
    restrict: 'E'
    replace: true
    scope:
        default: '@'
        dropdown: '='
        addQuestionClick: '&'
    template: 
        '<div class="bottom-buttons-container">' + 
        '<div class="add-item">' + 
        '<div class="btn-group dropup">' + 
        '<button type="button" class="btn btn-default btn-md" id="btnSelect" ng-click="addQuestionClick(default)">Add item</button>' +
        '<button type="button" class="btn btn-info btn-md dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>' + 
        '<ul class="dropdown-menu">' + 
        '<li ng-repeat="item in dropdown">' + 
        '<a ng-click="addQuestionClick(item)">{{item}}</a></li></ul></div></div></div>'  

Here is the html code:

<addquestionbutton default='Text' add-question-click="addItem(item)" dropdown="dropdownitems"></addquestionbutton>
1
  • Since this example is pretty simple, a plnkr to demonstrate would be helpful
    – JeremyWeir
    Apr 11, 2014 at 2:32

1 Answer 1

1

You just need to specify the parameter inside your function call. See this related question: calling method of parent controller from a directive in AngularJS

<button ng-click="addQuestionClick({item: default})" type="button" class="btn btn-default btn-md" id="btnSelect" >
...
<li ng-repeat="item in dropdown">
  <a ng-click="addQuestionClick({item: item})">{{item}}</a>
</li>

Here is a working demo: http://plnkr.co/edit/pqBp4C4x4riwMn5zHa7i?p=preview

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.