最初に2番目のドロップダウンを入力 - AngularJS

Question

2つのselectボックスがあります。最初のレポート名にはレポート名が含まれ、2番目のレポート名にはレポート名selectボックスに基づいて動的に入力する必要があります。

selectレポート名のときに、フォーマットselectに対応する書式を設定したいとします。次のように

私は、アレイ内のレポートのフォーマットを定義している

$scope.reportOptions = [{ 
    "reportName": "Cash Position", 
    "reportValue": "Cash Position Report", 
    "formats": ["CSV", "PDF", "XLS"] 
}, { 
    "reportName": "Detail Report", 
    "reportValue": "Detail Report", 
    "formats": ["CSV", "PDF", "XLS"] 
}, { 
    "reportName": "Reconciliation Report", 
    "reportValue": "Reconciliation Report", 
    "formats": ["BAI", "CSV", "PDF", "QBO", "QFX", "XLS"] 
}, { 
    "reportName": "Summary Report", 
    "reportValue": "Summary Report", 
    "formats": ["BAI", "CSV", "PDF", "XLS"] 
}, { 
    "reportName": "Sweep Report", 
    "reportValue": "Sweep Report", 
    "formats": ["CSV", "PDF", "XLS"] 
}, { 
    "reportName": 'Custom Report Name', 
    "reportValue": 'CustomReport', 
    "formats": ["BAI", "CSV", "PDF", "QBO", "QFX", "XLS"] 
}]; 

.filter('exportTypeFilter', function() { 
    return function(input, selectedreport, scope) { 
     var selectedReportFormatOptions = []; 
     var output = $.grep(scope.reportOptions, function(e) { 
      return e["reportValue"] == selectedreport; 
     }); 
     selectedReportFormatOptions = output[0]["formats"]; 
     return selectedReportFormatOptions; 
    }; 
}) 

値はselect箱の中に取り込ま取得されていないが、次のように私のフィルタです。私は何をしていますか？

FULL EXAMPLE

Answer 1

exportTypeFilterフィルタがundefinedの値を返しています。最初に実行すると、引数は""（空の文字列）として渡され、var outputはundefinedと評価されます。 https://jsfiddle.net/nwn838yb/5/

Answer 2

私はあなたのjsfiddleビットを変更しています。

は、見てください：https://jsfiddle.net/nwn838yb/1/

は基本的に、あなたも、あなたが望むものを達成するためのフィルタを必要としません。スコープに関連付けられた変数が必要です。スコープには、最初の選択から選択されたオブジェクトが格納されます。そのために私はあなたの範囲に$scope.selectedReport = {};を追加しました。

次に、$scope.reportOptionsまで繰り返し、ユーザー選択をselectedReportに保存する必要があります。 ng-model="selectedReport"を定義するだけで、どの可変ユーザー選択が格納されるかがわかります。ng-options="report.reportName for report in reportOptions" - これは「reportOptionsを繰り返し実行してください。オプションはreportNameを表示し、ユーザーが何かを選択した場合は選択したオブジェクトを保存します。

たとえば、ユーザーは「現金の位置」を選択しました。このオブジェクトは、selectedReportに格納されます。

{ 
    "reportName":"Cash Position", 
    "reportValue":"Cash Position Report", 
    "formats":["CSV","PDF","XLS"] 
} 

は、あなたが移入し、同様に第1の選択にselectedReport.formatを反復処理することができ、このオブジェクトを使用します。