Aurelia click.delegateがオブジェクト要素で機能していない、mouseover.delegateがうまく機能する

Question

私は単純なaureliaビューとビューモデルを持っています。私の見解では、svgを指すオブジェクトがあり、mouseover.delegate = "domouseover（）" mouseout.delegate = "domouseout（）"を実行できますが、click.delegate = "doClickSVG "doClickSVG（）メソッドは呼び出されません！ 私は何が間違っていますか？助けてください、私はこれを理解しようと多くの時間を費やしました！

また、別のdivのSVGを指すimgを持っています。私がclick.delegate = "doClickSVG（）"を実行すると、それはちょうどいいと呼ばれます。

click.delegateをclick.triggerにするなど、オブジェクトを操作するためにあらゆる種類のものを試しました。私は親要素にclick.delegateを置いて、役立つかどうかを知ることもできますが、運はありません。

ビュー

<object class="vehicle-icon vehicle-icon-selected" type="image/svg+xml" id="svgId" 
     data="e-3.svg" height="50" width="50" viewBox="0 0 50 50" 
     mouseover.delegate="domouseover()" mouseout.delegate="domouseout()" 
     click.delegate="doClickSVG()"> 

</object> 

<div> 
    <img src="e-3-old.svg" click.delegate="doClickSVG()"/> 
</div> 

ビューモデル エクスポートクラスのApp { メッセージ：=文字列 'は、オーレリアへようこそ！';

domouseover() { 
    document.getElementById(event.srcElement.id).style.backgroundColor = "yellow"; 
    document.getElementById(event.srcElement.id).getSVGDocument().getElementById("fillColor").style.fill = "blue"; 
} 
domouseout() { 
    document.getElementById(event.srcElement.id).style.backgroundColor = "white"; 
    document.getElementById(event.srcElement.id).getSVGDocument().getElementById("fillColor").style.fill = "green"; 
} 

doClick() { 
    alert("in doClick"); 
} 

doClickSVG() { 
    alert("in doClickSVG"); 
} 

} はここ

Answer 1

オブジェクト要素は、クリックイベントがデリゲートを使用して登録することを許可していない可能性があるコードを入力してください。代わりにclick.delegateをclick.triggerに置き換え、代わりに動作するかどうか確認してください。

Answer 2

はここに例を示しますhttps://gist.run?id=cef24c98e01402db7e7335464ff9e513

app.html

<template> 
    <object type="image/svg+xml" id="svgId" 
     data="e-3.svg" height="50" width="50" viewBox="0 0 50 50" 
     mouseover.delegate="domouseover()" mouseout.delegate="domouseout()" 
     click.delegate="doClickSVG()"> 

    </object> 

    <div> 
     <img src="e-3.svg" click.delegate="doClickSVG()"/> 
    </div> 
</template> 

app.js

export class App { 
    message: string = 'Welcome to Aurelia!'; 

    domouseover() { 
     document.getElementById(event.srcElement.id).style.backgroundColor = "yellow"; 
     document.getElementById(event.srcElement.id).getSVGDocument().getElementById("fillColor").style.fill = "blue"; 
    } 
    domouseout() { 
     document.getElementById(event.srcElement.id).style.backgroundColor = "white"; 
     document.getElementById(event.srcElement.id).getSVGDocument().getElementById("fillColor").style.fill = "green"; 
    } 

    doClickSVG() { 
     alert("in doClickSVG"); 
    } 
}