1、使用option

<select class="form-control" ng-model="searchType">
<option value="1" ng-selected="searchType=='1'">全部</option>
<option value="2">有推荐答案</option> // value=1,把1写成数字形式,在浏览器中还是会变成字符串显示
<option value="3">无推荐答案</option>
</select>
<script>
  .controller('myCtrl',function($scope){
    $scope.searchType=1;
  })
</script>

在angular中写如上select,第一次会出现空行,选中一个选项后,空行就消失了。

要使得一开始就没有空行需要将controller中的赋值变成字符串形式, $scope.searchType="1",这样就没有空行了。

2、使用ng-option

<select ng-options="item for item in value" ng-model="searchType"></select>
<script>
.controller('myCtrl',function($scope){
$scope.value=['全部','有推荐答案','无推荐答案'];
})
</script>

这样子是没有表示我要选择哪一项的,如果你不是强制要选择一项,可以在select中添加<option value="">请选择</option>

如果是强制要选择一项的,可以将$scope.searchType='全部',初始化searchType就可以避免空行了

angular select框 option空行的更多相关文章

  1. select 框option添加属性 js计算价格 保持两位小数

    <select name="" id=""> <volist name="v['childList']" id=" ...

  2. 将option添加到select框

    var select=document.createElement("select"); select.setAttribute("class","f ...

  3. JavaScript获取Select下拉框Option的Value和Text值的方法

    Js获取select下拉列表框各个Option的Value值相对比较容易,不过获取Text值却有点麻烦,对于一个初学JavaScript的 新手来说,可能一时还无从下手,那么就请看下本文的方法,以一个 ...

  4. jquery操作select下拉框的各种方法,获取选中项的值或文本,根据指定的值或文本选中select的option项等

    简介jquery里对select进行各种操作的方法,如联动.取值.根据值或文本来选中指定的select下拉框指定的option选项,读取select选中项的值和文本等. 这一章,站长总结一下jquer ...

  5. 下拉框select中option居中样式

    下拉框select中option居中样式 text-align:center;text-align-last:center;

  6. 关于java 获取 html select标签 下拉框 option 文本内容 隐藏域

    在HTML中从多选下拉框中提取已选中选项的文本内容到后台,被这个问题难倒了. demo.jsp文件 <select id="selecttype" name"typ ...

  7. select下拉框option的样式修改

    select原样式: 进行样式修改后的样式: 附上修改代码: //select外面必须包裹一个div,用来覆盖select原有的样式<div class="option"&g ...

  8. [Angular 2] ng-model and ng-for with Select and Option elements

    You can use Select and Option elements in combination with ng-for and ng-model to create mini-forms ...

  9. AngularJS下拉列表select在option动态变化之后多出了一个错误项的问题

    场景: Select初始化之后,选中select的某个选项 通过AngularJS更新select的选项 错误写法: HTML(使用ng-repeat) <div ng-app="Te ...

随机推荐

  1. python 数据标准化

  2. Adding basic files · lcobucci/jwt@aad22ed · GitHub

    Skip to content   Features Business Explore Marketplace Pricing   This repository Sign in or Sign up ...

  3. _STORAGE_WRITE_ERROR_:./Application/Runtime/Cache/Home/f8995a0e1afcdadc637612fae5a3b585.php

    将one think部署到服务器上出现下面的问题 _STORAGE_WRITE_ERROR_:./Application/Runtime/Cache/Home/f8995a0e1afcdadc6376 ...

  4. 使用新版本5+SDK创建最简Android原生工程(Android studio)http://ask.dcloud.net.cn/article/13232

    1 使用Android Studio创建一个工程 2 删除原生工程中Java目录下系统默认创建的源代码 3 复制SDK->libs->lib.5plus.base-release.aar文 ...

  5. 【Pyqt5】之高级控件QTableWidget的使用

    1:动态渲染数据+动态添加控件(按钮,进度条) class MainWindow(QWidget, Ui_MainFrom): def __init__(self): super(MainWindow ...

  6. PHP队列类

    /** * Created by PhpStorm. * User: LAMP-Q哥 * Date: 2017/8/3 * Time: 12:58 */ class Queue { private $ ...

  7. python Web中WSGI uWSGI 以及 uwsgi的区别

    WSGI协议 首先弄清下面几个概念: WSGI:全称是Web Server Gateway Interface,WSGI不是服务器,python模块,框架,API或者任何软件,只是一种规范,描述web ...

  8. BootstrapValidation一些tips

    BootstrapValidation一些tips:1. callback的用法 如果你有一些特别的检查需要,比如两个元素必需有一个有值,你可以在两个元素上加上callback,例:sel和cb必需有 ...

  9. golang变量-数据类型一

    package main import "fmt" var t1 = 100 var t2 = 200 var t3 = 300 var ( u1 = 100 u2 = 200 u ...

  10. concurrent模块

    concurrent包 concurrent.futrues模块 3.2版本引入 异步并行任务模块,提供一个高级的异步可执行的便利接口. 提供了两个池执行器 ThreadPoolExecutor异步调 ...