これは通常、AngularJSを使用する方法ではありませんが、私が達成したいことがAngularJSで実行可能かどうかは疑問でした。これが推奨された方法でない場合は、これを達成するためのヒントを教えてください。私がウェブプログラミング分野で新しいことを考えてください。AngularJS SVGウィジェットでデータをバインドする方法
私のプロジェクトでは、SVG & RaphaelJSを使用して描いています。キャンバスにいくつかのウィジェットがあり、「ホルダー」divに配置されています。私はこのウィジェットをAngularJSを使ってデータにバインドしようとしていますが、基本的に各ウィジェットはCustomControllerのオブジェクトにリンクされています。ウィジェットを初期化するときにCustomControllerにアクセスするにはどうしたらいいですか？
<html lang="en" style="height: 100%;" ng-app="myApp">
<head>
<script type="text/javascript"">
$(document).ready(function() {
var canvas = Raphael('holder', '800', '600');
var widget1 = new Widget1(params);
// initialize widgets here, that I need to bind to data using AngularJS
// I am not able to access the CustomController here when drawing my widgets
});
</script>
</head>
<body>
<div id="holder" ng-controller="CustomController">
</div>
</body>
</html>
AngularJSを使用してSVGウィジェットでデータバインディングを行うにはどうしますか？私はこれがAngularJSの目的ではないと思うようになり始めています。この場合、どうやってこの方法を教えてもらえますか？
UPDATE：
みんなのおかげであなたの答えのためにたくさん！要件は、ウィジェットがユーザーの入力を受け入れ、HTMLファイルに配置しないことです（モジュール化のため）。したがって、この指令は今のところ主要な選択肢のようです。リンクメソッドではRaphaelJSを使用してウィジェットを描画し、編集可能なオブジェクトを描画することもできますが、この方法ではAngularJSバインディングメカニズムを正しく使用できません。時計やイベントハンドラになります。私はSVGタグをディレクティブのテンプレートプロパティに入れてテンプレートにバインドすることはできますが、それはサポートされていないように思えます。
他にもこれについてのアイデアはありますか？
Btwはプロパティと、jQueryで取得したHTML要素（例：テキストボックス）との間でプログラム的にバインディングを適用する方法はありますか？
参考にする