Question

我正在尝试拥有一个容器，例如：

<div class="container">
    <div class="row">
        <h2 style="text-align:center;">Option 1: {{ dropDown1}} Option 2: {{ dropDown2 }}</h2>
        //submit button
    </div>
</div>

我有两个选择＆＃39;单行文本中的下拉列表。我可以按照以下方式使用它来实现功能：

<div class="container">
    <div class="row">
        <h2 style="text-align:center;">Select your configuration options:</h2>
        <select data-ng-options="o.name for o in options" data-ng-model="selectedOption"></select>
        <select data-ng-options="o.name for o in options2" data-ng-model="selectedOption"></select>
    </div>
</div>

使用两个单独的下拉框（我使用角度），但这些将显示在我的文本下方，并没有达到我想要的结果。知道如何在文本之间嵌套这些下拉列表吗？

Answer 1

您的第一个选择未关闭。

要让它们在同一条线上，给它们css：'display：inline-block'或'float：left'。（有更多的方法可以使用css来实现这一点，如果你想使用html，你应该学习css。）

Answer 2

要让<select>元素在<h2>标题内流动，请使用<span>元素来包含文字：

<h2 style="text-align:center;">
    <span>Option 1:</span>
    <select data-ng-options="o.name for o in options"
            data-ng-model="selectedOption">      
    </select>
    <span>Option 2: </span>
    <select data-ng-options="o.name for o in options"
            data-ng-model="selectedOption">      
    </select>
</h2>

Javascript - 在文本中嵌套选择下拉列表

2 个答案: