当颜色改变时，如何传递额外的参数？

Question

当颜色改变时，我想传递一些像这样的附加参数？

我正在使用这个angularjs颜色选择器。

https://github.com/ruhley/angular-color-picker/

我想像下面这样使用它

<color-picker ng-model="account_type.type_color" options="options" event-api="eventApi(extraParameter)">

<color-picker ng-model="account_type.type_color" options="options" event-api="eventApi">

你能帮我解决这个问题吗？

Answer 1

您可以向组件添加一个属性(假设是id)，并在onChange回调中读取它(使用api)。

​

angular.module('app', ['color.picker']).
controller('ctrl', function($scope) {
  $scope.color = '#FF0000';
  $scope.eventApi = {
    onChange:  function(api, color, $event) {
      const id = api.getElement().attr('id');
      console.log(id, color);
    },
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/tinycolor/1.4.1/tinycolor.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/angularjs-color-picker/3.4.8/angularjs-color-picker.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angularjs-color-picker/3.4.8/angularjs-color-picker.js"></script>

<div ng-app="app" ng-controller="ctrl">
  <color-picker id="cp-1" ng-model="color" options="options" api="api" event-api="eventApi"></color-picker>
</div>

​

https://stackblitz.com/edit/angularjs-bqe6ht?file=home%2Fhome.controller.js