实习第六周

治电小白菜

发布于 2020-08-25 14:35:24

4930

发布于 2020-08-25 14:35:24

文章被收录于专栏：技术综合技术综合

后台对接接口

1.ng 获取checkbox数值

https://stackoverflow.com/questions/11872832/how-to-respond-to-clicks-on-a-checkbox-in-an-angularjs-directive

2.ng获取多选框

     // 获取选择功能
        $scope.result = [];
        $scope.select = function(id, event) {
            console.log(event)
            console.log(action)
            var action = event.target;
            if (action.checked) {
                if ($scope.result.indexOf(id) == -1) {
                    $scope.result.push(id);
                }
            } else {
                var idx = $scope.result.indexOf(id);
                if (idx != -1) {
                    $scope.result.splice(idx, 1);
                }
            }
        }

3.权限管理的checkbox获取与显示

1)请求到权限，遍历到数组

    var permissions = []
    for (var i = 0, len = info.length; i < len; i++) {
        permissions.push(info[i].permissionId)
    }

2)前端代码

    <div class="treecheck">
      <ul>
        <li>
          <input type="checkbox" ng-click="select(1,$event)" id="1" ng-checked="select1" name="selected"> 首页
        </li>
        <li>
          <input type="checkbox" ng-click="select(2,$event)" id="2" ng-checked="select2" name="selected"> 数据分析
        </li>
    ......
      </ul>
    </div>

3)后台判断权限并在前台勾选

使用switch-case

    $scope.oncheck = function(n) {
                $log.log("ok oncheck？")
                switch (n) {
                    case "1":
                        $scope.select1 = true;
                        $log.log("1ok")
                        $scope.result.push(1)
                        break;
                    case "2":
                        $scope.select2 = true;
                        $log.log("2ok")
                        $scope.result.push(2)
                        break;
    .....
                }
    }

遍历权限并调用选取函数

     for (i = 0, len = permissions.length; i < len; i++) {
         $scope.oncheck(permissions[i])
         $log.log(permissions[i])
    }

4)显示结果

4.修改browsersync的端口号

由于默认的3000与我的服务有冲突所以修改端口号为其他的

    gulp.task('browserSync', function() {
        browserSync.init({
            // 路径
            server: {
                baseDir: './'
            },
            port: 3010//设置端口号
        })
    })