angular.js - Why can't ng-click of directive in angularjs pass parameters?

Question

First define a directive:

app.directive('conversation', [function() {
    return {
        restrict: 'E',
        templateUrl: 'conversation.html?date' + new Date().getTime(),
        replace: true,
        scope:{
            conversations:"=",
            changeConversation: "&"
        },
        link:function(scope, element, attributes){

        }
    };
}]);

Call

<conversation conversations="conversations" change-conversation="changeConversation(conversation)"></conversation>

<ul class="mdui-list">
    <li class="mdui-list-item mdui-ripple" ng-repeat="conversation in conversations" ng-click="changeConversation(conversation)">
        <p class="mdui-list-item-avatar">
            <img ng-src="{{conversation.chatThumbLogo}}"/>
        </p>
        <p class="mdui-list-item-content">
            <p class="mdui-list-item-title">{{conversation.chatName}}</p>
            <!--<p class="mdui-list-item-text mdui-list-item-one-line">hello world</p>-->
            <span class="im_badge" ng-bind="conversation.unreadCount" ng-if="conversation.unreadCount > 0"></span>
        </p>
    </li>
    <li class="mdui-pider-inset mdui-m-y-0"></li>
</ul>

conversation, undefined cannot be printed after ng-click triggers the function.

 $scope.changeConversation = function (conversation) {
        console.log(conversation)；
    }

Answer 1

$scope.changeConversation = function (conversation)；

This is the parent’s scope. There is no conversation variable in your parent’s scope.

Answer 2

I also think it’s @熊丸子说的那样，conversationThis variable is not the parent’s

Answer 3

conversation This directive restrict: 'E', is an element and you did not reference it in the template