AngularJS漏洞？ - 多重选择 - 动态设置的大小依赖于数量的选项 [英] AngularJS Bug? - Select Multiple - Dynamically set size dependent on number of options

问题描述

我要动态地控制大小的多选。

I want to dynamically control the size of a multi-select.

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>

注意如何尺寸属性仍为0，但NG-大小的变化，以7尽管插在同一个 tests.length 被使用。

Notice how size attribute remains at 0, however ng-size changes to 7 despite the same interpolated tests.length being used.

此外，尽管那里是一共有7个选项，浏览器呈现的尺寸仅显示4个选项。

Further, despite there being a total of 7 options, the browser rendered size only displays 4 options.

手动更改大小=0到尺寸=7谷歌Chrome浏览器的元素督察范围内，改变了选择的大小。

Manually changing size="0" to size="7" within google chrome's element inspector, changes the size of the select.

推荐答案

我遇到了一些问题， @size 。尝试 NG-ATTR尺寸，如：

I had some problems with @size. Try ng-attr-size, as:

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

这篇关于AngularJS漏洞？ - 多重选择 - 动态设置的大小依赖于数量的选项的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！