angularjs - AngularJS で select2 イベントをリッスンする方法

Question

特に「select2- removed」またはそのカスタム「change」イベントを聞くことができるようにしたいのですが、いくつかの例をインターネットで検索していますが、運がありません。

これが私がこれまでに行ったことです：

HTML:

<input type="hidden" class="form-control" id="tags" ui-select2="modal.tags" data-placeholder="Available Tags" ng-model="form.tags">

JavaScript (角度)

$scope.form = {tags: []};

postalTags = [
  {
    id: 1,
    text: 'Permanent Address'
  },
  {
    id: 2,
    text: 'Present Address'
  }
];

$scope.modal {
  tags: {
    'data': postalTags,
    'multiple': true
  }
};

// I doubt this is going to work, since i think this is only going to 
// listen on events emitted by $emit and $broadcast.
$scope.$on('select2-removed', function(event) {
    console.log(event);
});

// I can do this, but then i will not know which was removed and added
$scope.$watch('form.tags', function(data) {
  console.log(data);
});

ここでユーザーが実際に行っているのは、自分のアドレスにタグ付けされたタグを編集することです。編集とは、ユーザーが自分のアドレスに新しいタグをタグ付けしたり、以前にタグ付けされたタグを削除したりできることを意味します。そのため、どのタグが追加され、どのタグが削除されたかを追跡する必要があります。

アップデート

このディスカッションでもっともらしい解決策を見ましたが、提供されたコードを自分で動作させることはできないので、いくつかの回避策を講じました。

を追加する代わりに、

scope.$emit('select2:change', a);

このあたりのどこかで、

elm.select2(opts);

// Set initial value - I'm not sure about this but it seems to need to be there
elm.val(controller.$viewValue)

ここに置いたのですが、

 if (!isSelect) {
        // Set the view and model value and update the angular template manually for the ajax/multiple select2.
        elm.bind("change", function (e) {

          // custom added.
          scope.$emit('select2:change', e);

          e.stopImmediatePropagation();

それから私は私のコントローラーでいつものことをしました、

$scope.$on('select2:change', function(event, element) {
  if(element.added) console.log(element.added);
  if(element.removed) console.log(element.removed);
}

そして問題なく動作します。

しかし、これが非常に良いアイデアであるとは思えず、より良い解決策を望んでいます.