innerHTML returning undefined when <p></p> tag is clicked, but i am expecting its inside html. Any guess why?
-
Please provide the relevant code here in the question, not in an external site. Edit the question accordingly.Luiggi Mendoza– Luiggi Mendoza2015-02-06 17:29:58 +00:00Commented Feb 6, 2015 at 17:29
4 Answers
You can pass angular's $event
<p ng-click="abc($event)">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptas, nemo, numquam, incidunt similique quisquam dolor blanditiis quis veniam at laudantium quibusdam beatae ad ea voluptates impedit molestiae cum modi quam!
</p>
and get the innerHtml
$scope.abc = function(e) {
alert(e.target.innerHTML);
}
Comments
Because Angular passes $scope objects, not the DOM elements. Since $scope object doesn't have the innerHtml, you are getting undefined.
You can assign a model to either an input or a textarea, then pass this model to your function instead. Here is a plunker: http://plnkr.co/edit/VjFXacXJMa0PpS364wOb Or, if you want to stick with playing with DOM from controller which is against the nature of Angular, you can use $event.target.
Comments
You need $event.target or $event.currentTarget.
I would you should use $event.currentTarget, beacuse it will give you more precise element where you clicked.
CODE
$scope.abc = function($event){
//more precise element tracking will track sub element too using $event.currentTarget
alert( $event.currentTarget.innerHTML || $event.srcElement.innerHTML);
alert($event.target.innerHTML); //element tracking
}
Refer this answer for more info.