Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

Problem: I want to run the test function when I click on a <path> element in an SVG graphic. Right now nothing happens when I click the element. HOWEVER--when I replace ng-click with onclick="alert('success')" the alert works fine. Any suggestions?

In my code...

section of my html...

<div ng-controller="converter">
  <embed src="/image.svg">
  <!--This button successfully runs the test function-->
  <button ng-click="test()">Test</button>
my app.js...
var app = angular.module('app', []);
app.controller('converter', ['$scope', '$http', function($scope, $http){
    $scope.test = function(){
        console.log("this click event is working");
part of my embedded SVG file...
<rect id="e1-1-2" data-name="e1-1" class="cls-35" x="14" y="106" width="57" height="22" ng-click="test()"/>
(Here's the full code, for those interested: https://github.com/cwklausing/angular_guitar)
                @ARIFMAHMUDRANA: The button is just a test to make sure there isn't a problem with the angular. It's non-essential to the problem.
– cron.dog
                Dec 27, 2015 at 8:16
<svg width="400" height="110">
  <rect width="300" height="100" style="fill:rgb(0,0,255);stroke-width:3;stroke:rgb(0,0,0)" ng-click="test()" />
Here is the working Plunker
                @Sajeetharan: My rect was already wrapped in an svg, I just didn't include it. Mine still doesn't work; however, your example is extremely instructive, so I'll examine it more and hopefully find an answer.
– cron.dog
                Dec 27, 2015 at 8:32
        
Thanks for contributing an answer to Stack Overflow!
Please be sure to answer the question. Provide details and share your research!
But avoid …
Asking for help, clarification, or responding to other answers.
Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.