CODEWITHSUNDEEP
javascriptangularjs
Dinesh Ramasamy
Dinesh Ramasamy

Reputation: 994

Passing element in ng-click

I need to pass an element in ng-click as a param. 

<textarea id="chat-msg" name="chat-msg" class="p-r-40 chat-reply form-control"></textarea>
<img src="libs/converse/lib/emoji/smile.png" class="image-size" ng-click="insertEmotion(document.getElementById('chat-msg'))" ></img>

Here onclick works fine, but how can I pass it in ng-click?

Upvotes: 1

Views: 1927

Answers (3)

Rob
Rob

Reputation: 1860

Maybe try creating chat object and assign the model to the view like this?

http://jsfiddle.net/e9vJH/

var app = angular.module('emotionApp',[]);

app.controller('EmotionCtrl',function($scope) {
    $scope.chat = 'Chat message';
    $scope.insertEmotion = function(emotion) {
        $scope.chat = $scope.chat + emotion;
    };
});


<div ng-app="emotionApp" ng-controller="EmotionCtrl">
    <textarea ng-model="chat"></textarea>
    <hr>
    <button ng-click="insertEmotion(':)')">Insert</button>
</div>

Upvotes: 0

chrisg
chrisg

Reputation: 1117

It sounds like you may be trying to manipulate the DOM within a controller, which is not really the 'Angular way'. A better approach may be to seek to bind the textarea to a model variable, and have the ngClick directive update the model variable.

For example:

<textarea ng-model="chat"></textarea>
<img src="libs/converse/lib/emoji/smile.png" class="image-size" ng-click="chat = chat + ':-)'" ></img>

Here is a plunkr illustrating this: http://plnkr.co/edit/d0hMVbrwKy6nBgVxWBQP?p=preview

Upvotes: 0

davidmdem
davidmdem

Reputation: 3823

Consider moving the document.getElementById portion into the insertEmotion() function.

Call like this insertEmotion('chat-msg') where insertEmotion takes the element name as its parameter.

Upvotes: 1

Related Questions