检测SVG< path>内部的点击使用AngularJS [英] Detect click inside SVG <path> using AngularJS

问题描述

这个问题显示了如何使用Jquery进行操作，但我做不到让它在AagularJs中工作.

This question shows how to do it with Jquery, but I can't get it to work in AagularJs.

我有一个SVG图像，其中包含用<path>划定的几个区域，并希望ti检测单击了哪个区域.

I have an SVG image containing several areas delineated by <path>s, and want ti detect which one is clicked.

路径声明为

   <path id="inner" fill="transparent"  ng-click='innerRoomClicked'
        stroke="black" stroke-width="1"
        d="M 132.00,249.00
           C 132.00,249.00 132.00,348.00 132.00,348.00
             132.00,348.00 180.00,348.00 180.00,348.00

等

和

  <path id="A B C"
        fill="transparent"  ng-click='innerRoomClicked' stroke="black" stroke-width="1"
        d="M 171.06,307.00
           C 171.06,307.00 167.06,307.00 167.06,307.00
             167.06,307.00 169.00,301.94 169.00,301.94
             169.00,301.94 171.06,307.00 171.06,307.00 Z

等

，然后在控制器中

$scope.outerRoomClicked = function()
{
    alert('outerRoomClicked');
}

$scope.innerRoomClicked = function()
{
    alert('innerRoomClicked');
}

但是，这些都不被调用.我做错了什么?

BUT, neither of those are called. What am I doing wrongly?

推荐答案

将ng-click ='innerRoomClicked'更改为ng-click ='innerRoomClicked()'

Change ng-click='innerRoomClicked' to ng-click='innerRoomClicked()'

这篇关于检测SVG< path>内部的点击使用AngularJS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！