体面的jQuery经验丰富，新AngularJS。

我有颜色附带的jQuery colorpickers（按类.colorpicker标记）的列表（可变数量）的页面。在页面上，这伟大工程的静态的，PHP生成的版本;但将其转换到NG-重复，jQuery的不赶未来occurances。

有没有可以用$。对（被抓）的事件，还是有其他一些偷偷摸摸的最佳实践的方式与AngularJS做到这一点？我四处搜寻，但每次我发现答案已经如何设置$。对（点击）或类似的。

 ＆LT; UL类=无样式＆GT;  ＆LT;李NG重复=颜色showcolors＆GT;    ＆LT，输入类型=色级=输入迷你ColorPicker的NG模型=color.hex＆GT; {{color.category}}  ＆LT; /李＆GT;＆LT; / UL＆GT; 

解决方案

任何时候你要操作DOM或使用jQuery的功能/插件;它的时间为一个指令。你可以指令添加到您的纳克重复，因为它是被添加到DOM结合了jQuery ColorPicker中输入字段。是这样的：

 ＆LT; UL类=无样式＆GT;  ＆LT;李NG重复=颜色showcolors＆GT;    ＆LT;输入数据JQ-颜色拾取式=颜色级=输入迷你ColorPicker的NG模型=color.hex＆GT; {{color.category}}  ＆LT; /李＆GT;＆LT; / UL＆GT; 

然后添加指令：

  yourApp.directive（'jqColorpicker'，函数（）{    VAR linkFn =功能（范围，元素，ATTRS）{        //这里的元素= $（本）        //绑定你的插件或事件（点击，悬停等）在这里        element.colorpicker（）;        element.bind（'点击'，功能（E）{          // 做一点事        }）;    }    返回{        限制：'A'，        链接：linkFn    }}）; 

请注意，这是未经测试，但应该解决您的问题。如果你设置了Plunker或的jsfiddle，我带你去看看。

另外，一定要检查出 jQuery的直通角UI 的功能。

Decently experienced with jQuery, new to AngularJS.

I have a page with a list of colors (variable number) with attached jQuery colorpickers (marked by class ".colorpicker"). On the static, PHP-generated version of the page, that works great; but converting it over to ng-repeat, jQuery doesn't catch future occurances.

Is there an event that can be caught with $.on(), or is there some other sneaky best-practices way to accomplish this with AngularJS? I've searched around, but every answer I've found has been how to set up $.on('click') or similar.

<ul class="unstyled">
  <li ng-repeat="color in showcolors">
    <input type="color" class="input-mini colorpicker" ng-model="color.hex"> {{color.category}}
  </li>
</ul>

Anytime you want to manipulate the DOM or use a jQuery feature/plugin; it's time for a directive. You could add a directive to your ng-repeat that binds the jQuery colorpicker to the input field as it's being added to the DOM. Something like:

<ul class="unstyled">
  <li ng-repeat="color in showcolors">
    <input data-jq-colorpicker type="color" class="input-mini colorpicker" ng-model="color.hex"> {{color.category}}
  </li>
</ul>

And then add the directive:

yourApp.directive('jqColorpicker', function(){
    var linkFn = function(scope,element,attrs){
        // element here = $(this)
        // bind your plugin or events (click, hover etc.) here
        element.colorpicker();
        element.bind('click', function(e){
          // do something
        });
    }

    return {
        restrict:'A',
        link: linkFn
    }
});

Note, this is untested but should solve your problem. If you set up a Plunker or JSFiddle, I'll take a look.

Also, be sure to check out the jQuery passthrough feature of Angular UI.