angular+bootstrap select选择框问题

Html5中标准的select标签

Select标签默认选中第一个option

<select>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>

给option添加selected = "selected"属性，所选option就会默认选中

< select  id =  "sel" >
< option  value = "1" >1</ option >
< option  value = "2"  selected = "selected" >2</ option >
< option  value = "3" >3</ option >
</ select >

(Html的title属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）)

工作中用到的select选择框

 <select ng-model="default_select"  class="selectpicker">
<option value="1">test1</option>
<option value="2">test2</option>
<option value="3">test3</option>
</select>

这是浏览器中显示的上面代码的select框，select标签被转换成了<ul><li>标签,因为工作中用到了bootstrap，引入了selectpicker，这个标签会把select框变成<ul><li>标签

select选择框变成了ul标签，所以使用给option加selected属性会失效

解决办法：

方法1.在angular中，当用(ngmodel)指令绑定select选择框时，当select框ngmodel绑定的值和option的value相同时，option为默认选中状态
所以我们在初始化时，给select框ngmodel绑定的值初始化为我们想选择的option的value，代码如下

$scope.default_select = 1
指定初始值

 <select ng-model="default_select" class="selectpicker" >
<option value="1">test1</option>
<option value="2">test2</option>
<option value="3">test3</option>
</select>

即可实现默认选中
方法2.我们可以去掉selectpicker类名，这样就会变回正常的select标签
样例如下：

 <select ng-model="default_select" >
<option value="1">test1</option>
<option value="2">test2</option>
<option value="3">test3</option>
</select>

正常使用就可以了

（定位bug是修改bug最重要的环节）