1

アプリケーションに新しい予定を追加するウィザードを作成しています。ウィザードの最後のページには、いくつかの基準に基づくすべての潜在的な競合を示すタブ付きセクションが含まれています。各タブは基準の 1 つであり、Angular Grid を使用して競合のリストを表示します。各グリッドには同じ列がありますが、異なるデータが含まれているため、ディレクティブを使用して Angular Grid とそのグリッド オプションを Template にラップし、rowData をディレクティブの別の属性に設定したいと考えています。現在、ディレクティブには次のものがあります。

'use strict';
app.directive('inApptConflict', ['angularGrid', function (angularGrid) {
    return {
        restrict: 'A',
        transclude: true,
        require: '?ngModel',
        template: '<div class="ag-fresh conflictGrid" ag-grid="{{ conflictGridOptions }} ng-transclude"></div>',
        controller: function ($scope) {
            // function for displaying dates in grid
            function datetimeCellRendererFunc(params) {...}
            // column definitions
            var conflictColumnDefs = [
                { colId: "Id", field: "Id", hide: true },
                { colId: "StartTime", field: "StartTime", headerName: "Start", width: 150, cellRenderer: datetimeCellRendererFunc } ...
            ];
            // Grid options
            $scope.conflictGridOptions = {
                columnDefs: conflictColumnDefs,
                rowData: null,
                angularCompileRows: true,
                enableColReseize: true
            };
        },
        link: function ($scope, $elem, $attrs, ngModel) {
            $scope.conflictGridOptions.rowData = ngModel;
            $scope.conflictGridOptions.api.onNewRows();
        }
    };
}]);

私のビューには次のコードがあります：

<!-- Tab panes -->
<div role="tabpanel" class="tab-pane fade in active" id="conflicts1" data-ng-show="apptCtrl.conflicts1">
    <div in-appt-conflict data-ng-model="apptCtrl.conflicts1"></div>
</div>
<div role="tabpanel" class="tab-pane fade" id="conflicts2" data-ng-show="apptCtrl.conflicts2">
    <div in-appt-conflict data-ng-model="apptCtrl.conflicts2"></div>
</div>

これを実行するたびに、次のエラーが発生します。

エラー: [$injector:unpr] 不明なプロバイダー: angularGridProvider <- angularGrid <- inApptConflictDirective

ag-grid を認識するディレクティブを取得するために、他に何をする必要があるのか​​ わかりません。$compile も使用してみましたが、同じエラーが発生します。

ディレクティブからサードパーティ モジュールを呼び出すために追加する必要があるものはありますか? これは、グリッドを 3 つの別々のグリッド オプションで 3 回別々に使用したときに機能しました。

助けてくれてありがとう！

4

1 に答える 1

0

ディレクティブに「angularGrid」を注入する必要はありません (そのような注入可能な要素はありません)。登録されたすべてのディレクティブは、Angular モジュールに登録するとすぐに、すべてのテンプレートで使用できます。

var module = angular.module("example", ["agGrid"]);必要なのは、テンプレートとディレクティブで ag-grid を使用する場合のように、Angular モジュールの依存関係に「agGrid」を追加することだけです 。詳細については、 ag-grid のドキュメントを参照してください。

したがって、行から「angularGrid」を削除すると、準備が整いapp.directive('inApptConflict', ['angularGrid', function (angularGrid) {ます。

于 2016-01-02T08:28:04.147 に答える