5

レポートをフィルタリングするためのドロップダウンリストで満たされたビューがあります。リンクとして表示される保存済みフィルターのビューもあります。ユーザーが保存したフィルターをクリックすると、ドロップダウンリストの適切な値が選択されるようにします。ドロップダウンは適切に入力されています。保存されたフィルター リンクには、ng-click保存されたフィルター値のコレクションを反復処理し、正しい値を自動的に選択する関数を呼び出す があります。選択したオプションをプログラムで設定する方法がわかりません。どんな助けでも大歓迎です！

<select uid="locSelect" 
        class="span12" 
        ng-model="reportDetail.selectedLoc" 
        ng-options="loc.dbid as loc.serviceName for loc in reportDetail.locList | orderBy:'name'">
    <option uid="unselectedLocOption" value="">-- Select One --</option>
</select>

保存されたフィルターのリストは次のとおりです。

<div class=" well fixed-search" style="overflow-x: hidden;overflow-y: auto;">
<div class="well-header">
    Saved Filters
</div>
<div ng-if="!hasSavedFilters">
    <span>No saved filters</span>
</div>
<ul ng-if="hasSavedFilters" class="nav nav-list dashboard-list">
    <li ng-repeat="filter in reportDetail.savedFilters">
        <a uid="savedFilter" href="" ng-click="reportDetail.loadSavedFilters(filter.filters)">
            <span ng-bind="filter.title"></span>
        </a>
    </li>
</ul>

そして、これが私のコントローラーです

(function(){
'use strict';

var ReportDetailController = function(ReportsService, $scope){
    var _locList = {};
    var _hospitalStatusList = {};
    var _providerStatusList = {};
    var _savedFilters = [];
    var _sourceTypeList = {};
    var _dateRangeList = {};

    var _init = function(){
        ReportsService.getCurrentReportSavedFilters().then(function(data){
            $scope.reportDetail.savedFilters =data;
            $scope.hasSavedFilters = ReportsService.hasSavedFilters();
        });

        ReportsService.getLOCListForDDL().then(function(data){
            $scope.reportDetail.locList = data;
            //$scope.reportDetail.selectedLoc = $scope.reportDetail.locList[0];
        });

        ReportsService.getSelectListData()
            .then(function(data){
                $scope.reportDetail.sourceTypeList = data.CONNECTION_TARGET_STATUS;
                $scope.reportDetail.hospitalStatusList = data.CONNECTION_SOURCE_STATUS;
            });
        ReportsService.getDateRangesForDDL()
            .then(function(data){
                $scope.reportDetail.dateRangeList = data;
            });

        $scope.reportDetail.providerStatusList = ReportsService.getProviderStatusForDDL();


    };



    var _loadSavedFilters = function(filters){
        for(var i = 0, l = $scope.reportDetail.locList.length; i<l; i++){
            if($scope.reportDetail.locList[i].serviceName == filters.levelOfCare){
                 $scope.reportDetail.selectedLoc = $scope.reportDetail.locList[i];
                console.log($scope.reportDetail.selectedLoc);
            }
        }
    }

    var _isActive = function(filter){
        for(var i = 0, l = $scope.reportDetail.savedFilters.length; i<l; i++){
            if(filter.title == $scope.reportDetail.savedFilters[i].title){
                return true;
            }
            return false;
        }
    }

    var _generateReport = function(){
        return ReportsService.generateReport();
    };

    $scope.reportDetail = {
        init: _init,
        selectedLoc: null,
        isActive: _isActive,
        locList: _locList,
        selectedHospitalStatus: 'NOTIFIED',
        hospitalStatusList: _hospitalStatusList,
        selectedProviderStatus: 'NEW',
        providerStatusList: _providerStatusList,
        selectedSourceType: 'CONNECTED',
        sourceTypeList: _sourceTypeList,
        selectedDateRange: '',
        dateRangeList: _dateRangeList,
        savedFilters: _savedFilters,
        loadSavedFilters: _loadSavedFilters,
        generateReport: _generateReport
    };

    $scope.reportDetail.init();
};

app.controller('ReportDetailController', ['ReportsService', '$scope',  ReportDetailController]);
})();
4

5 に答える 5

1

時間の都合で別ルートで行くことになりました。サービス レイヤーである種のイベント バスを作成し、コントローラーでイベントをサブスクライブして、モデルを更新し、ng-selected で ng-repeat を使用しました。

これが ng-options で機能しなかった理由を理解することにまだ興味があります。モデルと ng-options のタイプが一致し、すべてが正しく配線されているように見えました。もっと時間があれば、元の問題に再び取り組みます。回答してくれたすべての人に感謝します!

于 2014-07-23T16:43:54.543 に答える
1

Angular が値を比較し、どのオプションが「選択されている」かを確認するには、ng-model と ng-options を供給する式が一致する必要があります。「デイブ」が示したように。

于 2014-07-23T14:59:38.143 に答える