angularjs - 默认情况下从选择框中选择第一个值 - AngularJS

Question

我有两个选择框。第二个选择框从第一个选择框填充。

我已经为第二个选择框应用了过滤器，以根据在第一个选择框中选择的选项进行填充。第二个选择框从数组 var outputformats = []; 填充

这是我的代码

HTML

<select name="reporttype"id="reporttype" 
        ng-init="reporttype='1115'" 
        ng-model="reporttype">
    <option value="1115">Previous Day Composite Report</option>
    <option value="1114">ACH Receive</option>
</select>


<select name="outputformat" id="outputformat" 
        ng-model="outputformat" 
        ng-options="format for format in outputformats | outputformatfilter: reporttype:this">      
</select> Value : {{outputformat}}

筛选

angular.module('myApp.outputformatfilter',[])
    .filter('outputformatfilter', function () {
        return function (input,selectedreport,scope) {

            var outputFormatReport  = {"1115":"HTML,PDF","1114":"CSV,EXCEL"};
            var outputformats = outputFormatReport[selectedreport].split(',');

            return outputformats;
        };
    });

现在我想要的是每当第二个选择框中的选项发生变化时， 默认情况下应该选择它的第一个选项 ，即默认情况下应选择数组中的第一个选项。

更新 :

更新 fiddle ，添加 ng-if= reporttype !== ''到第二个选择框

FIDDLE

Answer 1

在您的 Controller 上，观察过滤的选项并对其采取行动:

function myController ($scope) {
    // watch the filtered output formats
    $scope.$watchCollection("filteredOutputFormats", function(val) {
        // select the first one when it changes
        $scope.outputformat = val[0];
    });
}

确保将过滤后的结果分配给 $scope 变量:

<select name="outputformat" id="outputformat" 
        ng-model="outputformat" 
        ng-options="format for format in filteredOutputFormats = (outputformats | outputformatfilter: reporttype:this)">        
</select>

JSFIDDLE