如何在AngularJS Bootstrap Colorpicker中使用事件

lin*_*lin 8 html javascript color-picker angularjs

我无法弄清楚事件如何与Angular Bootstrap Colorpicker一起使用.这是一个从开发人员示例中分叉出来的Plunker.遗憾的是,开发人员没有使用事件的例子.

活动一样colorpicker-selected,colorpicker-selected-saturation,colorpicker-selected-hue,colorpicker-selected-alpha,colorpicker-shown,colorpicker-closed应予以支持.只有一个例子会很好.

基本代码没有任何事件:

'use strict';

angular.module('colorApp', ['colorpicker.module'])
  .controller('MainCtrl', ['$scope', function($scope) {

    $scope.nonInput = {
      color: ''
    };

    $scope.resetNonInputColor = function() {
      $scope.nonInput = {
        color: '#ffffff'
      };
    };
}]);
Run Code Online (Sandbox Code Playgroud)

DRo*_*son 10

鉴于您有一个ngModel附加的(根据源代码似乎是必需的),您只需$on在指令的祖先中捕获发出的事件.

$scope.$on('colorpicker-shown', function(event, colorObject){
     console.log(colorObject);
});
Run Code Online (Sandbox Code Playgroud)

您询问的所有事件(colorpicker-selected-alpha等)都可以使用其原始名称.