编程语言
首页 > 编程语言> > javascript – AngularJS Bug? – 选择多个 – 根据选项数量动态设置大小

javascript – AngularJS Bug? – 选择多个 – 根据选项数量动态设置大小

作者:互联网

我想动态控制多选的大小.

HTML

<select 
    class="form-control" 
    ng-model="formData.selected_tests" 
    ng-options="c.test for c in tests"
    multiple="true"
    ng-multiple="true"
    name="tests"
    id="tests"
    size="{{ tests.length }}"
    ng-size="{{ tests.length }}">
</select>

JS

$http({ method: 'GET', url: '/api/v1/test' })
    .success(function(data, status, headers, config) {
        $scope.tests = data;
    })
    .error(function(data, status, headers, config) {});

检查元素的输出

<select 
    class="form-control ng-valid ng-dirty" 
    ng-model="formData.selected_tests" 
    ng-options="c.test for c in tests" 
    multiple="true" 
    ng-multiple="true" 
    name="tests" 
    id="tests" 
    size="0" 
    ng-size="7">
        ... Options ...
</select>

请注意size属性如何保持为0,但是尽管使用了相同的插值tests.length,但ng-size更改为7.

此外,尽管总共有7个选项,但浏览器渲染的大小仅显示4个选项.

在google chrome的元素检查器中手动将size =“0”更改为size =“7”,会更改select的大小.

解决方法:

@size我遇到了一些问题.尝试ng-attr-size,如下:

<select
    ...
    ng-attr-size="{{ tests.length }}">
</select>

标签:javascript,angularjs,html-select
来源: https://codeday.me/bug/20190830/1771086.html