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

发布时间：2020-12-17 17:07:33 所属栏目：安全来源：网络整理

导读：我有两个选择框.第二个选择框从第一个选择框填充. 我已经为第二个选择框应用了一个过滤器,以根据在第一个选择框中选择的选项进行填充.第二个选择框从数组填充var outputformats = []; 这是我的代码 HTML select name="reporttype"id="reporttype" ng-init="r

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

我已经为第二个选择框应用了一个过滤器,以根据在第一个选择框中选择的选项进行填充.第二个选择框从数组填充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;
        };
    });

现在我想要的是每当第二个选择框中的选项发生更改时,默认情况下应选择其第一个选项,即默认情况下应选择数组中的第一个选项.

更新：

更新了小提琴,将ng-if = reporttype！==”添加到第二个选择框

FIDDLE

解决方法

在您的控制器上,观察已过滤的选项并对其执行操作：

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

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!