标签: angularjs-select

我是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演示

我有一个select元素定义如下:

<select name="country_id" id="country_id" required="required" ng-model="newAddressForm.country_id">
    <option value="">Select Country</option>
    <option ng-repeat="country in countries" value="{{country.id}}">{{country.name}}</option>
</select>

当我没有在包含这个select元素的指令中设置任何值时,一切正常.但是,当我执行类似的操作时newAddressForm.country_id = 98,Angular不会选择值为98的选项,而是在select元素的顶部注入一个新选项,如下所示:

<option value="? string:98 ?"></option>

是什么赋予了？这种格式是什么,为什么会发生这种情况？请注意,如果我console.log(newAddressForm.country_id)在指令中执行a ,我得到一个正常的"98",它在生成的HTML中只是奇怪.

编辑: 情境更新.切换到使用ng-select,但问题仍然存在.

奇怪的元素不再出现,但是,现在顶部还有另一个元素,一个只有问号?作为值,没有标签.

那就是我收集的,Angular的"none selected"选择.我仍然不明白为什么它不会选择我告诉它选择的选项.

做newAddressForm.country_id = 98不动也没有结果.这是为什么？

默认情况下,如果在a中没有选择任何内容,则angular使用空值<select>.如何将其更改为文字Please select one？

我有这个锚标记，我根据对象的日期更改我的视图。我正在尝试将其更改为选择选项，但它没有按照我的方式工作。

这是锚标记语法：

 <a href="#" ng-repeat="item in home.prData" ng-click="home.selectedPr = item; $event.preventDefault();
 $event.stopPropagation();">{{item.date}}</a>

我试图将其更改为使用选择选项时的样子

 <select st-search="{{item.date}}" class="show-tick form-control dropdown_custom_list">
      <option value="">- select a date -</option>
      <option ng-repeat="item in home.prData" value="{{home.selectedPr = item}}">{{item.date}}
      </option>
  </select>

我创建了一个示例 plunkr 来实现我想要实现的目标：

我的代码

虽然ng-model用于选择框,ng-selected也用于选项,其中某些条件是ng-selected时间不起作用.

如果我将删除ng-model而不是ng-selected正在工作,但是如果我将删除ng-model而不是我应该如何获得控制器中选择框的值.

请帮忙 !

这是我的代码......

HTML:

<select class="form-control" ng-change="accessModeSelected()">
     <option ng-selected="mode.status == '1'"  ng-repeat="mode in storageResult.accessMode" ng-value="mode.name" name="accessMode{{$index}}" id="accessMode">
           {{mode.name}}
     </option>
</select>

AngularJS:

$scope.storageResult   = {
           "storageAccount":"Enable", 
           "user": "sdcard",
           "pass": "sdcard",
           "wifiIP": "0",
           "ipAddr": "0",
           "accessMode": [
                {"name": "Local Storage","status": "0"},
                {"name":"WiFi Storage", "status": "1"},
                {"name":"Internet Storage", "status": "0"}
            ]
         }