发表于: 2017-05-23 23:04:49
1 1159
今天完成的事情:
完善任务10新增与编辑的逻辑编写,解决了编辑也进去后无法渲染出图片与下拉选项。
明天的计划:
完成说明富文本编辑器的引入使用,修复下拉列表刷新的bug,准备demo。
遇到的问题:
1 下拉选项无法正确渲染。
原写法:
<select class="form-control" ng-model="selType">
<option value="">全部</option>
<option value="0">首页Banner</option>
<option value="1">找职位Banner</option>
<option value="2">找精英Banner</option>
<option value="3">行业大图</option>
</select>
使用select与options编写,vaule值来表示下拉选项,通过ng-model来获取value值,这样就把点击的值传给后台。
但是当后台获取了值传给了ng-model,ng-model无法将这个值传给value,导致下拉选项无法正确的渲染。
正确的写法:
使用ng-options来编写下拉选项:
html:
<select class="form-control" ng-if="selectType == 3" ng-model="industryType" ng-options="x.value as x.name for x in industryOptions" required></select>
js部分:
$scope.selectType = '请选择';
$scope.typeOptions = [
{value:'',name:'请选择'},
{value:0,name:'首页Banner'},
{value:1,name:'找职位Banner'},
{value:2,name:'找精英Banner'},
{value:3,name:'行业大图'}
];
可以正反赋值,都能渲染。
收获:
ng-options的用法,功能很强大,注意关于数组和对象有不同的写法:
ng-options有以下格式的语法
for array data sources:
- label for value in array
- select as label for value in array
- label group by group for value in array
- select as label group by group for value in array track by trackexpr
for object data sources:
- label for (key , value) in object
- select as label for (key , value) in object
- label group by group for (key, value) in object
- select as label group by group for (key, value) in ob
评论