AngularJS和SVG-使用ng-click <rect> 元件？

Question

問題：單擊SVG圖形中的<path>元素時，我想運行test功能。 現在，當我單擊該元素時，什么也沒有發生。 但是，當我用onclick="alert('success')"替換ng-click ，警報效果很好。 有什么建議么？

用我的代碼...

我的html部分...

<div ng-controller="converter">
  <embed src="/image.svg">
  <!--This button successfully runs the test function-->
  <button ng-click="test()">Test</button>
</div>

我的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");
    }
}]);

我的嵌入式SVG文件的一部分...

<rect id="e1-1-2" data-name="e1-1" class="cls-35" x="14" y="106" width="57" height="22" ng-click="test()"/>

（這是完整的代碼，對於那些感興趣的人： https : //github.com/cwklausing/angular_guitar ）

Answer 1

將其包裝在svg中

<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()" />
</svg>

這是工作中的Plunker