Question

我有一个项目，客户端坚持右键菜单。问题是从右键菜单中的选项调用的函数需要访问模型的信息。这是一个示例小提琴http://jsfiddle.net/7yCwW/1/ $scope.junkDataSet = [{index:foo, color:bar}]。基本上我需要的是一个带有显示颜色选项的上下文菜单。单击“显示颜色”后，会显示一条警告，指出右键单击项目的颜色。

Answer 1

原始回答

您可以将相关数据绑定为元素内的专有属性，并让接收函数使用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框架中拥有所有东西：）

角度js中继器中的上下文菜单

1 个答案: