Question

我的语义用户界面有问题：我正在建立一个网页，通过点击按钮可以累积几个搜索字段。

我的问题来自于它们出现在屏幕上时对齐搜索字段。

<div class="row" ng-repeat='searchCriterion in searchCriteria track by $index'>

    <div class="two wide column" ng-if='searchCriterion.type=="crit_1"'>
        <i class="remove icon" ng-click='removeField($index)'></i>Crit 1
    </div>

    <div class="thirteen wide column" ng-if='searchCriterion.type=="crit_1"'>
        <select class="ui fluid selection dropdown" ng- options='comparisonTag.name for comparisonTag in comparisonTags'>
        </select>
        <br>
        <div class="ui labeled fluid input">
            <div class="ui label">for</div>
            <input type="number">
        </div>
   </div>

<div ng-if='searchCriterion.type=="crit_2"'>
    <div class="two wide column">
        <i class="remove icon" ng-click='removeField($index)'></i>Crit 2
    </div>
    <div class="ten wide column">
        <select class="ui fluid selection dropdown" ng-options='alphTag.name for alphTag in alphTags'>
        </select>
        <div class="ui labeled fluid input">
            <div class="ui label">value</div>
            <input type="text">
        </div>
    </div>
</div>

以下是CodePen来说明我的问题： http://codepen.io/daedalus418/pen/KWJvzB

如果您点击＆＃34;类别1＆＃34;＆gt; ＆＃34; Crit 1＆＃34;，一切都按照我的意愿调整，但我重复了ng-if =＆＃39; searchCriterion.type ==＆＃34; crit_1＆＃34;＆＃39;两次，我想避免这种情况。

如果您点击＆＃34;类别2＆＃34;＆gt; ＆＃34; Crit 2＆＃34;，我将我的搜索条件附加在另一个div中，允许我只写一次ng-if ...但是在左边对齐这个额外div的所有内容。

我想得到＆＃34; Crit 1＆＃34;＆nbsp;＆nbsp;＆nbsp;＆nbsp;＆nbsp;＆nbsp;＆nbsp;＆nbsp;＆nbsp;＆nbsp;＆nbsp;＆nbsp; 我已经尝试了几个着作，如上所述使用左对齐但我总是得到相同的结果。

有人有想法吗？

谢谢。

搜索字段与语义UI

0 个答案: