AriaNg-Native/app/views/setting.html

<div class="row" data-option-key="{{option.key}}">
    <div class="setting-key setting-key-without-desc col-sm-4">
        <span ng-bind="option.nameKey | translate"></span>
        <em ng-bind="'(' + option.key + ')'"></em>
        <i class="icon-primary fa fa-question-circle" ng-if="(option.descriptionKey | translate) !== ''"
           data-toggle="popover" data-trigger="hover" data-placement="auto top" data-container="body" data-content="{{option.descriptionKey | translate}}"></i>
        <span class="description" ng-if="option.showCount && option.separator && (optionValue || fixedValue || (placeholder && showPlaceholderCount))"
              ng-bind="'format.settings.total-count' | translate: {count: getTotalCount()}"></span>
        <i class="icon-primary fa fa-info-circle" ng-if="(option.since && option.since !== '')" ng-tooltip="{{('format.requires.aria2-version' | translate: {version: option.since})}}" ng-tooltip-container="body" ng-tooltip-placement="right"></i>
    </div>
    <div class="setting-value col-sm-8">
        <div ng-class="{'input-group': !!option.suffix}">
            <div class="form-group has-feedback" ng-class="[optionStatus.getStatusFeedbackStyle()]">
                <pre ng-if="fixedValue && fixedValue.trim()" ng-bind="fixedValue"></pre>
                <input class="form-control" type="text" placeholder="{{placeholder}}"
                       data-support-force-delete-empty="{{supportForceDeleteEmpty}}" ng-disabled="!!option.readonly"
                       ng-if="(option.type === 'string' && !option.showHistory) || option.type === 'integer' || option.type === 'float'"
                       ng-model="optionValue" ng-change="changeValue(optionValue, true)" ng-keyup="inputKeyUp($event, true)"/>
                <input-dropdown input-class-name="form-control" style="width: 100%;" input-placeholder="{{placeholder}}"
                                data-support-force-delete-empty="{{supportForceDeleteEmpty}}"
                                ng-if="option.type === 'string' && option.showHistory" disabled="!!option.readonly"
                                ng-model="optionValue" ng-keyup="inputKeyUp($event, from === 'input')"
                                selected-item="optionValue" allow-custom-input="true"
                                only-show-non-empty-dropdown="true" default-dropdown-items="history"
                                filter-list-method="filterHistory(userInput)"
                                value-changed-method="changeValue(value, from === 'input')"></input-dropdown>
                <textarea class="form-control" rows="6" placeholder="{{placeholder}}"
                          data-support-force-delete-empty="{{supportForceDeleteEmpty}}" ng-disabled="!!option.readonly"
                          ng-if="option.type === 'text'"
                          ng-model="optionValue"
                          ng-change="changeValue(optionValue, true)" ng-keyup="inputKeyUp($event, true)"></textarea>
                <select class="form-control" style="width: 100%;" ng-disabled="!!option.readonly" ng-class="{'placeholder': !optionValue}"
                        ng-if="option.type === 'boolean' || option.type === 'option'"
                        ng-model="optionValue" ng-change="changeValue(optionValue, false)"
                        ng-options="item.value as (item.name | translate) for item in option.options">
                    <option value="" disabled="disabled" ng-bind="(placeholder | translate)" style="display: none;"></option>
                </select>
                <div class="form-control-icon" ng-if="optionStatus.isShowStatusIcon()">
                    <i class="fa form-control-feedback" ng-class="[optionStatus.getStatusIcon()]"></i>
                </div>
            </div>
            <span class="input-group-addon" ng-if="!!option.suffix" ng-bind="option.suffix | translate"></span>
        </div>
    </div>
</div>