相关疑难解决方法(0)

我正在使用占位符进行文本输入,这很好.但我也想为我的选择框使用占位符.当然我可以使用这段代码:

<select>
    <option value="">Select your option</option>
    <option value="hurr">Durr</option>
</select>

但是"选择你的选项"是黑色而不是光线.所以我的解决方案可能是基于CSS的.jQuery也很好.

这只会使下拉列表中的选项变为灰色(因此点击箭头后):

option:first {
    color: #999;
}

编辑:问题是:人们如何在选择框中创建占位符？但它已经得到了回答,欢呼.

使用此选项会导致所选值始终为灰色(即使选择了实际选项后):

select {
    color: #999;
}

我是AngularJS的新手.我搜索了很多,但它并没有解决我的问题.

我在选择框中第一次得到一个空白选项.

这是我的HTML代码

<div ng-app="MyApp1">
    <div ng-controller="MyController">
        <input type="text" ng-model="feed.name" placeholder="Name" />
        <select ng-model="feed.config">
            <option ng-repeat="template in configs">{{template.name}}</option>
        </select>
    </div>
</div>

JS

var MyApp=angular.module('MyApp1',[])
MyApp.controller('MyController', function($scope) {
    $scope.feed = {};

      //Configuration
      $scope.configs = [
                                 {'name': 'Config 1',
                                  'value': 'config1'},
                                 {'name': 'Config 2',
                                  'value': 'config2'},
                                 {'name': 'Config 3',
                                  'value': 'config3'}
                               ];
      //Setting first option as selected in configuration select
      $scope.feed.config = $scope.configs[0].value;
});

但它似乎没有用.我怎样才能解决这个问题？这是JSFiddle演示

源JSON数据是:

[
  {"name":"Alabama","code":"AL"},
  {"name":"Alaska","code":"AK"},
  {"name":"American Samoa","code":"AS"},
  ...
]

我试试

ng-options="i.code as i.name for i in regions"

但我得到:

<option value="?" selected="selected"></option>
<option value="0">Alabama</option>
<option value="1">Alaska</option>
<option value="2">American Samoa</option>

虽然我期待得到:

<option value="AL">Alabama</option>
<option value="AK">Alaska</option>
<option value="AS">American Samoa</option>

那么,如何获得价值属性并摆脱"？" 项目？

顺便说一句,如果我将$ scope.regions设置为静态JSON而不是AJAX请求的结果,则空项目将消失.

我是AngularJS的初学者,目前我正在使用Django的Web应用程序,我可以在其中使用AngularJS作为前端部分.我的问题是,使用范围内的对象填充的下拉列表始终以空白元素开头(如果我从列表中选择一个,则问题就消失了).这会产生问题,因为如果用户通常不选择任何POST请求,它将不再起作用.我想知道如何使用预选值或类似的东西.这是我的代码的一部分:

选择标签:

<select id="sel" class="input-block-level" ng-model="list_category">
            <option ng-repeat="obj in list_categories.data" value="{{obj.id}}">{{obj.name}}</option>
            <option value="Other">Other</option>
        </select>

$ scope.list_categories:

var listcategoryPromise = ListCategory.get();
    listcategoryPromise.then(function(response) {
        $scope.list_categories = {
            meta : response.data.meta,
            data : response.data.objects
        };
    });

<select ng-model="team.captain" ng-options="player.name for player in team.players"></select>

这会正确创建选择列表以选择团队队长.但是,默认情况下会选择空白选项.我们如何从列表中预选第一个玩家呢？

<select ng-model="team.captain" ng-options="player.name for player in team.players" class="ng-pristine ng-valid">
  <option value="0">John</option>
  <option value="1">Bobby</option>
</select>

我尝试添加,ng-init="team.captain='0'"但没有帮助.

更新显然这是因为

传递给ng-options的一组选项中不存在ng-model引用的值.

来源:为什么AngularJS在select中包含一个空选项？

但是,问题仍然存在,为什么使用ng-init不起作用？

<select ng-init="team.captain='0'" ng-model="team.captain" ng-options="player.name for player in team.players"></select>

我希望以下代码呈现下拉列表,默认情况下选择第三个选项.但是,当我使用angularjs绑定选择时,默认选择消失.任何想法？

var myApp = angular.module('myApp', []);

...

<div>
  <select id="myselection" ng-model="selectedColors">
    <option value="1" >Red</option>
     <option value="2">Blue</option>
     <option value="3" selected="selected">Green</option>
  </select>

  <div>
    Selected Colors: {{selectedColors }}
  </div>
</div>

这是一个有效的例子:http://jsfiddle.net/TXPJZ/134/

谢谢!

我在这里使用ng-repeat来渲染具有不同值和文本的选项,并且还设置默认值.但是,再次使用angular添加一个空的未定义选项.

<select ng-model="newItem.financial_year_id" required style="min-width:180px;">
   <option ng-repeat="financial in account_year" value="{{financial.id}}" ng-selected="financial.status=='Active'">{{financial.financial_year}}</option>
</select>

现在选择了活动的一个,但空选项仍然呈现.

我正在使用oi-select库,我已根据我的项目需要对其进行了定制,并且我已经为它编写了指令.问题是它花了太多时间说10秒加载大约3k阵列数据.我想尽量缩短它的时间.在这里,我为此创造了plunker.

我有指令加载所有工厂数据并提供给oi-select,在我的代码中这里是html

<small><b>select {{MPhardwaresListDropDown.length}}</b></small>
                        <div style="padding-top: 7px">
                            <div title="" class="selected-multiple-items">
                                    {{MPselectedHardwares.length}} selected
                            </div>
                            <grid-multi-select id="hardwareId" clean="clean" optionlist="MPhardwaresListDropDown" colval="name"></grid-multi-select>
                        </div>

指令中的HTML代码如下

<div>
        <div ng-repeat="optionVal in tempOptionList | orderBy : ['-originalcheck','+label']" prevent-close>
            <div ng-if="optionVal.label">
                <label class="checkbox" ng-if="!typeFilterOptions || (optionVal.label.toString().toLowerCase().indexOf(typeFilterOptions.toLowerCase()) > -1)">
                    <input type="checkbox" name="checkbox1" ng-checked="optionVal.check" ng-model="optionVal.check"/>

                    <span class="checkbox__input"></span>
                    <span class="checkbox__label" style="color:#A9A9A9;">{{optionVal.label}}</span>
                </label>
            </div>
            <div ng-if="!optionVal.label">
                <label class="checkbox" ng-if="!typeFilterOptions || (optionVal.val.toString().toLowerCase().indexOf(typeFilterOptions.toLowerCase()) > -1)">
                    <input type="checkbox" name="checkbox1" ng-checked="optionVal.check" ng-model="optionVal.check" ng-change="checking(typeFilterOptions)"/>

                    <span class="checkbox__input"></span>
                    <span class="checkbox__label" style="color:#A9A9A9;">{{optionVal.val}}</span>
                </label>
            </div>



        </div>

角度代码太大了,在这个问题中请参考plunker,但这是如何循环

scope.selection = scope.selectionorg; …

我目前在我的指令上有以下指令select.

ng-options="option.value as option.title for option in exportTypes"

$ scope.exportTypes =与每个对象的数组title,value和generatesFile属性.我希望将generatesFile属性添加为为此select生成的data-generates-file每个属性的属性<option>.

有关如何做到这一点的任何想法？

我有以下代码:

<md-select ng-change="updateView()" 
           ng-model="userSelected" 
           ng-if="authuser.privilege >= 3">
    <md-option ng-repeat="user in users" 
               ng-value="user">{{user.name}}</md-option>
</md-select>

但是在我的upadateView()中,当我记录userSelected时,我总是得到这个我选择的:

Object {$$mdSelectId: 1}

我在我的控制器中初始化它

$scope.personneSelected = {};

我错过了什么 ？