angular:关于ng-repeat和ng-options

二者都可用于实现下拉列表,并且度娘上有很多关于两者的内容,此处不再赘述,本文为了说明在最近的项目中遇到的相关问题,
可以写成如下格式

ng-repeat

ng-options

区别:
  1. 如上所示,当在select中时ng-repeat需要写在option中,而ng-options不需要option,会自动生成。
  2. ng-options 一定要和ng-model 搭配,ng-model获取的是列表的value值。
  3. 注意!!
    1).ng-options的value值得类型是number,当list.id是string类型时无法循环
    2).ng-repeat的value值类型是string,当list.id是number类型时无法循环
    可以根据id类型不同选择,这是在最近的项目中发现的问题,通过上述方法解决,如果有不同见解,欢迎留言。

另:
附上在解决过程中尝试的方法,可能重复,有问题仅做记录(以下简写,以下两种方法都是使用ng-repeat)

【步骤】:列表list中id类型规定为number类型,首次实现页面下拉框时,使用的是ng-repeat,
【结果】:下拉列表显示为空白
【问题】:F12查看Elements,发现下拉列表中option如下显示

            

【解决1】 在js中将id装换为string 类型

             list.id = list.id+"";

【方法的问题】
1.只是写了一句话,但是需要的地方很多,导致重复....
2.改变了原类型

【解决2】 朋友的思路,在js中写一个方法将id装换为string 类型,并在页面上使用这个方法,具体如下:
.js:

              $scope.toString = function(){
                  list.id.toString();
              }

.html


【方法的问题】
1.控制台会报错,错误没有深究,路过大神可以指路,如果以后知道了,我会进行补充_.

你可能感兴趣的:(angular:关于ng-repeat和ng-options)