Angular JSで複数のcontrollerの処理の共通化

Question

###環境
Angular JS 1.5.8
UI Grid

###疑問概要
複数のcontrollerでほぼ共通の処理を共通化したい。
その処理は$scopeへの値設定が主目的。

###疑問詳細
Angular JSで、あるページにUi Gridを使い項目表示用に
複数のグリッドを配置しています。

ページとグリッドはそれぞれがcontrollerを持ち、
親:ページ
子：グリッド
となるようにcontrollerを設定しています。

複数配置してあるグリッドでは、それぞれ行が選択された際に
選択された行のレコードIdを親に通知する処理をしています。

この親：ページへの通知処理は親:ページ内の設定対象配列
が異なるだけでほぼ同一の処理です。

このため、この処理を何らかの形で共通化したいのですが、
$scopeを使用した処理の為、service等では設定できずにおります。

共通化の方法はございますでしょうか。

###作成したコード
function rowClicked() {

//「選択されている行」を抽出 可読性の為変数に代入
var currentSelectedRows = $scope.gridApi.selection.getSelectedRows();

//選択された行数 ループに使用 可読性の為変数に代入
var looplimit = $scope.gridApi.selection.getSelectedRows().length;

//親：ページのcontroller内の配列に現在の選択行のIDを登録
//各グリッド毎に異なるのは、
//$scope.$parent.kartekubunGrdSelId配列のみ

$scope.$parent.kartekubunGrdSelId = [];//初期化                                                                     
for (var i = 0; i < looplimit; i++) {                                                                            
    $scope.$parent.kartekubunGrdSelId[i] = currentSelectedRows[i].Id;                             
} 
                                                                                                           
//親コントローラーに行選択を通知
$scope.$emit('CellSelected', 'kartekubunGrd');                                                                   

}

よろしくお願い致します。

Answer 1

ui-gridとそのコントローラーをdirectiveにするのはどうでしょうか。

directiveを使用する際にパラメータとしてgridの名称（kartekubunGrd等）を渡してあげることで、emit時のパラメータにgridの名称を渡すことが出来ます。
以下のようにgridで選択したidもemitで渡してあげれば親コントローラのイベントハンドリングでgrid名と選択したidを使用した処理ができると思います。

var gridName = directiveの引数;
$scope.$emit('CellSelected', {name:gridName, id:selectedId});
}

Comments

[xexnteratail]

ご回答ありがとうございます。

なるほど！
directiveとして処理をするのですね。
試してみます。

結果を報告致します。

[xexnteratail]

directiveとすることでうまくいきました！
ありがとうございました！