0

angularjsモーダルのソフトウェア設計とベストプラクティスに関する正しいアプローチは何だろうと思っています。私のアプリケーションには、独自のコントローラーを使用するメイン ウィンドウがあり、そこにはモーダル用の show()、hide() & destroy 関数があります。私のメインウィンドウのボタンはモーダルを表示します。そこには、親スコープから継承された変数を持つ分離スコープと、独自のコントローラーがあります。オブジェクトをダイアログに渡して「変更」操作を行い、モーダルを閉じてモーダルに入力されたデータの新しいオブジェクトを作成する「作成」ボタンを使用できるようにしたいと思います。

私は2つの問題に直面しています. ) 2. show()、hide() との矛盾: show() はメイン コントローラに常駐する必要がありますが、モーダルには独自のコントローラがあるため、hide() および destroy() を実装する必要があります。 、コードの責任の点で私には非常に気分が悪い.

そのような状況での良い習慣は何ですか?

4

2 に答える 2

0

これらがベストプラクティスかどうかはわかりませんが、うまくいきます...

1:

私のコントローラーで：

$scope.modelData = {};  // This will be loaded from an ajax call or set somehow

私のダイアログディレクティブスコープでは：

scope: {
    ngModel: "="
}

私のhtmlで：

<dialog-directive ng-model='modelData'></dialog-directive>

2: ディレクティブが関数を割り当てるオブジェクトを渡すことにしました。その後、コントローラーでこのオブジェクトを使用して、ディレクティブで何かを行うことができます。

コントローラ：

$scope.dialogFuncs = {};

指令：

scope: {
    ngModel: "=",
    dialogFuncs: "="
},
controller: ['$scope', function($scope) {
    $scope.dialogFuncs.openDialog = function() {
        // code to open the dialog here
    }

    $scope.dialogFuncs.closeDialog = function() {
        // close dialog code here
    }
}]

HTML:

<dialog-directive ng-model='modelData' dialog-funcs='dialogFuncs'></dialog-directive>
....
<button ng-click='dialogFuncs.openDialog()'>Open Dialog</button>

お役に立てれば。

于 2015-02-23T19:18:41.183 に答える