发表于: 2017-06-15 23:42:43

1 921


1、完成状态、类型输入框的绑定传参及搜索。

<select ng-model="sta">    //双向绑定
   <option value="">全部</option>  //value设定对应值,匹配后端原始数据
   <option value="2">上线</option>
   <option value="1">草稿</option>
</select>

2、完成分页设置及单页跳转,前后页面跳转。

$scope.pageNum=function () {    //点击页码跳转函数
   $scope.page=event.target.innerHTML;   //点击元素的值,赋给page(后面传参)
   $scope.enterPage();             //执行一次确认跳转    
}
$scope.prevPage=function () {   //上一页跳转函数
if($scope.page>1){          //从第二页开始,具有执行功能
$scope.page=$scope.page-1;     //页码减一并赋值
   $scope.enterPage();      //执行跳转,下一页同。
}}

页码按钮的html

<button  class="page" ng-repeat="a in pageTotal" ng-click="pageNum()">{{$index + 1}}</button>

其中pageTotal为后端列表总行数(total)与当前自己设置每页几行(size)的比值取上浮,并设置为数组。

3、传参部分,根据后端接口,成功后返回一个函数并渲染到页面。

$http.get("/carrots-admin-ajax/a/article/search?" + "page=" +$scope.page + "&size="+$scope.size + "&type="+$scope.type+ "&status="+$scope.sta)

4、清空函数是将type和status赋值为空,并执行确认搜索函数。

收获:算是比较完整的进行了一遍后端进行搜索传参的过程,知识点get。

困难:当前页码的变色没做好,然后上下搜索和确定按钮事件是绑定在一起的,感觉跟实际正常体验有点出入,可能需要分开写点击函数并传参。

计划:完成剩下的,时间框是绑定和传参(好像需要用到angular的插件),完成任务8。



返回列表 返回列表
评论

    分享到