ASP.NET MVCアプリケーションでAngularディレクティブを再利用するには？

Question

私は多くのエリアとモデル、ビュー、コントローラを内部に持つASP.NET MVCアプリケーションを持っています。私はAngularで記述したい小さな電卓を持っています。なぜなら、開発者としては私にとっては簡単で、（jQueryのみではなく）ユーザーにとってはよりクールだからです。

私は、この電卓をMVCアプリケーションのいくつかの領域で別々のビューにしたいと思っています。私が思いつくことができる最高の解決策は、Angularディレクティブを作成し、必要なすべてのビューで使用することです。私の質問は、これが動作するかどうかと、私はディレクティブを使用するすべてのビューに対して別のAngularモジュールを作成する必要があるかどうかです。

より良い解決策と提案は歓迎します。アンギュラドキュメントから

Answer 1

例：https://docs.angularjs.org/tutorial/step_07

phonecatApp.config(['$routeProvider', 
    function($routeProvider) { 
    $routeProvider. 
     when('/phones', { 
     templateUrl: 'partials/phone-list.html', 
     controller: 'PhoneListCtrl' 
     }). 
     when('/phones/:phoneId', { 
     templateUrl: 'partials/phone-detail.html', 
     controller: 'PhoneDetailCtrl' 
     }). 
     otherwise({ 
     redirectTo: '/phones' 
     }); 
    }]); 

は、ページ（HTML）あたりのようなあなたのように多くのcontrollesを設定できるの。各htmにはあなたのカスタム計算機指令が含まれます。

すべてのコントローラは、同じモジュールに登録することができる。

するvar phonecatControllers = angular.module（ 'phonecatControllers'、[]）。

phonecatControllers.controller('PhoneListCtrl', ['$scope', '$http', 
    function ($scope, $http) { 
    $http.get('phones/phones.json').success(function(data) { 
     $scope.phones = data; 
    }); 

    $scope.orderProp = 'age'; 
    }]); 

phonecatControllers.controller('PhoneDetailCtrl', ['$scope', '$routeParams', 
    function($scope, $routeParams) { 
    $scope.phoneId = $routeParams.phoneId; 
    }]); 

Answer 2

これは私の取り組みです。ビューごとに別々のモジュールは必要ありません。あなただけの電卓ディレクティブを提供するために、これを使用している場合、あなただけのような何かができます：あなたは部分的ビューを使用している場合

angular.module('calculator', []) 
    .directive('onscreenCalculator', function() { ... }); 

を私は知りませんが、あなたがしている場合は、使用している場合、それは問題になる可能性ビューレベルでng-app = "calculator"ディレクティブ。個人的には、私はあなたの_Layout.cshtmlに入れて、次にを知ってくださいあなたは1つだけのインスタンスを持っているつもりです。

あなたの最大の課題は、真にAngularアプリを書いているわけではなく、指示を使用しているので、計算結果をあなたのビューに戻す方法です。私はそれがいくつかの周りで遊ぶことで行うことができると確信しています。