Aneta Jabłońska Aneta Jabłońska - 3 years ago 132
AngularJS Question

Function from the template code is not called

In code I have call, for example addComment, why after pasted from HTML do directiv template she didn't work? What should I do.

And second question is what differences is between

modal-window-card card="card"


and

modal-window-card="card"


Because I saw that probably I have only assigned variable
card.name
and in first example I have whole object but why?

HTML:



<div modal-window-card card="card"></div>


Directiv:



App.directive('modalWindowCard', function () {
return {
scope: {
card: "=",
},
template: `
<div id="{{$parent.$parent.$index}}/{{$parent.$index}}" class="modalDialog">
<div>
<a href="#close" title="Close" class="close">X</a>
<div>
<div class="windows-title">
<span class="header">{{ card.name }} </span>
</div>
<div class="window-header">
<p class="quiet-header">W liscie {{ item.list }}</p>
</div>

<div class="windows-description">
<span class="loud-header">Dodaj komentarz:</span>
<form ng-submit="addComment($parent.$index, $index, commentCard)">
<input id="text2" ng-model="commentCard" cols="30" rows="5">
</form>
<button ng-click="addComment($parent.$index, $index, commentCard)" style="margin-top:5px;">Zapisz</button>
</div>

<div class="window-activity">
<span class="loud-header">Aktywnosc</span>
<span class="quiet-header" style="float: right; margin-right: 310px;">Pokaz Szczególy</span>
<div class="window-comments">
<div style="border-bottom: 1px solid #E2E4E6; margin-top: 5px;" ng-repeat="comment in card.comments">
<span class="name-header">{{ comment.author }}</span>

</div>
</div>
</div>
</div>
</div>
</div>`
}
})

Answer Source

You should use @ instead of using =

scope: {
        card: "@", 
    }

in div element

<div modal-window-card card="card value is here"></div>

You are calling a directive "modalWindowCard" using modal-window-card and you are passing the attribute named "card" to the directive's isolate scope property.

in this case

<div modal-window-card="card value is here"></div>

Angularjs tries to find a directive but it can't parse this '='. The name 'card' in modal-window-card="card value is here" is NOT an attribute which you can send it to the directive.

I have modified your code please check here

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download