2

クライアントが右クリック メニューを要求するプロジェクトがあります。問題は、右クリック メニューのオプションから呼び出される関数が、モデルに関する情報にアクセスできる必要があることです。これはフィドルの例http://jsfiddle.net/7yCwW/1/ $scope.junkDataSet = [{index:foo, color:bar}]です。基本的に必要なのは、色を表示するオプションを備えたコンテキスト メニューです。「色を表示」をクリックすると、右クリックされたアイテムの色を示すアラートが表示されます。

4

1 に答える 1

2

元の答え

関連するデータを要素内の独自の属性としてバインドし、受信関数に el.getAttribute('mycolor'); を使用して属性値を取得させることができます。

http://jsfiddle.net/7yCwW/3/

<div ng-controller="Ctrl">
    <div ng-repeat="junk in junkDataSet" onclick="fooClick(event)" mycolor="{{junk.color}}" class="contextmenu">right click here</div>
</div>

<div id="myoutput" ></div>

...

function fooClick(e){
   var e = e || window.event
   var t = e.target;
    var clr = t.getAttribute("mycolor")
    var el = document.getElementById('myoutput');
    el.innerHTML = "You picked " + clr;
    el.style.background = clr;
    if(clr == 'black' || clr == "blue'){
        el.style.color = "white";
    }
    else{
        el.style.color = "black";
    }
}

編集 完全なオブジェクト参照を渡し、ng-click ディレクティブを使用して遊んでみました。使用できます

<div ng-repeat="{{junk in junkDataSet}}" onclick='fooClick({{junk}})' > ... </div>
// in JSFiddle becomes invalid markup, but is actually OK
<div onclick="{ "index" : 0, "color" : "red" }" > ... </div>

ng-click の使用は、コンテキスト メニューで false を返して、既定のブラウザーの右クリック アクションが発生しないようにする必要があるため、使用できません。これは現在、コントローラーメソッドに解決される ng-click ディレクティブ b/c では達成できず、return ステートメントはその操作を混乱させます。

ng-contextmenu をいじってみましたが、そのイベント ハンドラー機能は存在しません。Angular に追加するのは簡単ですが、コア製品の一部ではありません

それはあなたをどこに残しますか？元の回答（データを特別な属性にバインドする）を使用するか、JS変数にキャッシュされた参照を完全なリストに保持し、一部の属性のキーのみをバインドできます。または、キーをパラメーターとして関数に渡します。エレガントではありませんが、v1 フレームワークにすべてを含めることはできません :)

于 2013-04-03T00:10:05.110 に答える