剣道グリッド編集可能行問題

Question

私が直面している問題をplunkに再現しました。

私は、編集可能な行を持つ剣道グリッドを持っています。

1. 編集&「Units In Stock」列の値をクリックすると、アラートポップアップが2回発生します。
2. キャンセル&をクリックし、再度同じ列をクリックすると、ポップアップが1回だけ開きます。

なぜこの問題が発生するのですか。この問題はどうして回避できますか。そのため、行が編集モードになっていても、ポップアップは1回だけ開きます。

$scope.grid.options = { 
dataSource: $scope.dataSource, 
pageable: true, 
height: 550, 
toolbar: ["create"], 
columns: [ 
    "ProductName", 
    { field: "UnitPrice", title: "Unit Price", format: "{0:c}", width: "120px" }, 
    { field: "UnitsInStock", title:"Units In Stock", width: "120px", template: '<a href="" ng-click="test(dataItem.UnitsInStock)">{{dataItem.UnitsInStock}}</a>'}, 
    { field: "Discontinued", width: "120px" }, 
    { command: ["edit", "destroy"], title: "&nbsp;", width: "250px" }], 
editable: "inline" 
}; 

Answer 1

オブザーバーの挙動は、フィールドが編集不可能な場合でも、グリッドは、インライン編集モードにあるとき、全体の編集行がまだ構築されているという事実によって引き起こされるので、クリックイベントハンドラを二回添付されます。

最も簡単な回避策は、イベントデータオブジェクトのstopImmediatePropagation()を呼び出すことです。同じもののjQueryドキュメントがあります。

これをチェックアウトするplunk。