在Ionic 2中動態添加SVG，如何添加onclick函數？

Question

我正在研究Ionic 2中的一個應用程序。從JSON文件中讀取有關樂器鍵盤的數據，我動態地將圓對象添加到svg中，這是在instrument-detail.html文件中實現的。這在儀器detail.ts正常工作：

var circle = document.createElementNS('http://www.w3.org/2000/svg', 'circle'); 
circle.setAttribute('id', this.keyIndex.toString()); 
circle.setAttribute('cx', posX.toString()); 
circle.setAttribute('cy', posY.toString()); 
circle.setAttribute('r', radius.toString()); 
circle.setAttribute('class', 'buttonStandard'); 
svg.appendChild(circle); 

現在我想觸摸時的一些操作添加到圈子裏，調用一個方法DoSomething的（）在儀器detail.ts。

circle.setAttribute('class', '(click)="doSomething()"'); 

不工作，我想，我知道爲什麼...

circle.setAttribute('class', 'onclick="doSomething()"'); 

導致了運行時錯誤：

Uncaught ReferenceError: doSomething is not defined at SVGCircleElement.onclick 

不知道如何解決我的問題？如何正確解決該方法？

預先感謝您！

Answer 1

實測值的溶液： 添加一個事件監聽：

circle.addEventListener("click", function() {   // Attach desired event 
          let myId= this.id.split('_')[0]; 
          alert(myId+": Moving to page #"+myId); 

         }, false);