一、今天完成的事：

1.基本完成任务8；

2.实现列表分页功能，点击上一页下一页或者点击页码数字，以及input框中输入页码数字，均能正常跳转到对应的列表；

3.实现更改上下线状态和删除功能；

二、明天的计划：

1.实现ui-serf传参，页面刷新的时候不会重新加载整个页面；

三、遇到的问题：

1.对angular的指令不太熟悉，查资料发现ng-class的写法，可以直接给html元素增加class属性；

2.查资料发现ng-click可以直接传输参数，在页码自动生成的时候，可以将页码数传到ng-click的参数中，实现动态获取当前点击的页码；

四、收获：

1、自己通过angular实现页码的点击函数，对应加载不同的列表页，并将首页末页，上一页，下一个，通过一个函数来实现。将当前点击的内容传给函数参数来实现不同的跳转；

<li ><a href="" ng-class="firstPage" ng-click="currentPage(1)">首页</a></li>
<li><a href="" ng-class="lastPage" ng-click="currentPage(n-1)">< 上一页</a></li>
<li ng-repeat="x in articlePage" ><a href="#" ng-click="currentPage(x)">{{x}}</a></li>
<li><a href="" ng-class="nextPage" ng-click="currentPage(n+1)">> 下一页</a></li>
<li><a href="" ng-class="endPage" ng-click="currentPage(articleNum)">末页</a></li>
<li>
   去第
   <input type="text" class="text-center form-sm" ng-model="inputNum">
   页
   <button class="btn btn-primary" ng-click="currentPage(inputNum)">确定</button>
</li>

$scope.currentPage = function (x) {
    if (x == 1 ) {
        $scope.firstPage = "disabled";
        $scope.lastPage = "disabled";
        $scope.nextPage = "";
        $scope.endPage = "";
    }else if (x == $scope.articlePage.length){
        $scope.nextPage = "disabled";
        $scope.endPage = "disabled";
        $scope.firstPage = "";
        $scope.lastPage = "";
    }else if (x > $scope.articlePage.length) {
        alert("请不要超过最大页数！");
        $scope.inputNum = 1;
    }else{
        $scope.firstPage = "";
        $scope.lastPage = "";
        $scope.nextPage = "";
        $scope.endPage = "";
    }
    if (x > $scope.articlePage.length) {
        $scope.page = $scope.inputNum
    }else {
        $scope.page = x;
    }
    http()

2、实现更改上下线状态，直接获取当前点击内容的id和status，更改状态的时候将id和status发给对应接口，然后重新请求列表页，实现刷新；

<button class="btn btn-xs btn-primary" ng-click="changeStatus(x.id,x.status)">{{x.status|btnFilter}}</button>

$scope.changeStatus = function (id,status) {
    if (status == 1) {
        if (confirm("上线后该图片将在轮播banner中展示。 \n 是否执行上线操作？")) {
            status = 2;
        }
    }else {
        if (confirm("下线后该图片将不展示在轮播banner中。\n 是否执行下线操作？")){
            status = 1;
        }
    }
    $http({
        method: 'put',
        url: '/carrots-admin-ajax/a/u/article/status',
        params:{
            id: id ,
            status : status
        }
    }).then(function successCallback(response) {
        http();

3、实现删除功能，直接获取当前点击内容的id，并将id发给对应的接口，然后重新请求列表，注意该请求和之前的格式不一样；

<button class="btn btn-xs btn-danger" ng-click="deleteId(x.id)">删除</button>

$scope.deleteId = function (id) {
    alert(id);
    if (confirm("是否确定删除？")) {
        $http({
            method: 'delete',
            //注意该请求的url格式和之前的不一样
            url: '/carrots-admin-ajax/a/u/article/' + id
        }).then(function successCallback(response) {
            http();

4、师兄查看任务时发现在用inpu框翻页的时候发现会将页面定死，点击搜索只能请求当前页面的内容，查看代码后发现是请求的时候没有将ng-modle绑定的input数值清空导致，更改bug后显示正常，并其他会导致该问题的情况均更改，测试后正常；