Following up on the previous inquiry: How can I pass my model to the Directive?
Although the directive successfully displays the data, the ng-click function seems inactive.
This is how my partial page currently appears:
<div>selected user:{{selectedUser.UserName}} </div>
<div user-list data-users="users"></div>
Here's how my directive looks now:
tsUui.directive('userList', function(){
return{
restrict: 'A',
template: '<table>'+
'<tr>'+
'<th>User Name</th>'+
'<th>First Name</th>'+
'<th>Last Name</th>'+
'<th>Email Address</th>'+
'</tr>'+
'<tr ng-repeat="user in users" ng-click="selectUser(user)">'+
'<td>{{user.UserName}}</td>'+
'<td>{{user.FirstName}}</td>'+
'<td>{{user.LastName}}</td>'+
'<td>{{user.Email}}</td>'+
'</tr>'+
'</table>',
scope:{
selectedUser: '=',
users: '='
},
link: function (scope, elem, attrs){
scope.selectUser = function(user){
console.log("hi");
selectedUser=user;
};
}
}
});
The data is being displayed correctly, but upon clicking a row, there are no changes - no console logs and the selected user binding remains unchanged. What am I missing here?
Update: The console does log the interaction, but the selected user binding remains stagnant...