今天完成的事情：终于实现了angular的登录，但是还没有做表单验证和列表的读取。以及做了关于颜色的小课堂

明天计划的事情：学习更多关于angularjs的知识，做完表单验证和列表读取，完成任务7.

遇到的问题：目前对于angularjs的理解非常不够，很多代码都是复制过来的，或者直接照着写然后改的。

看攻略说ｐｏｓｔ上传用ｄａｔａ，ｇｅｔ上传用ｐａｒａｍｓ，然而我用ｐｏｓｔ上传用ｄａｔａ更本不行，改成ｐａｒａｍａｓ就好了

收获：ａｎｇｕｌａｒ登录的上传方法

$scope.getFormData=function(){

console.log($scope.userInfo);

$http({

method:"POST",

url:"/carrots-admin-ajax/a/login",

params:{name:$scope.userInfo.userName,pwd:$scope.userInfo.password}

}).then(

function success(res){

console.log("请求成功",res);

if(res.data instanceof Object){

$scope.tip = res.data.message;

if(res.data.message=="success"){

window.location="view/task6.html"

}

}

else{

console.log("登录失败")

}

})

function error(res){

console.log("请求失败")

}

}

小课堂：ｔａｓｋ１：关于颜色的随机方法以及随机的性能

１背景介绍

颜色的随机在网页制作中有非常多的用途，尤其是在制作各种炫酷的特效的时候

２知识剖析

１颜色代码的组成方式

一共有３种方式：文本方式比如ｏｒａｎｇｅ；ｈｅｘ方式比如：＃ｆ３２３４４；ｒｇｂ方式比如：ｒｇｂ（１２３，２３４，４）；

２如何产生随机的颜色代码

对于文本方式，只能列出一个包含文本的数组，然后从中随机选择，随机性能非常有限。

对于ｈｅｘ方式，可以通过产生１０进制的能表示最大的６位的１６进制的数以内的数然后转换为１６进制。随机性能较好。

对于ｒｇｂ方法，可以产生３个０＜＝ｘ＜２５６的随机整数来实现随机，并且如果使用ｒｇｂａ，还可以产生随机的透明度，随机性能非常好。

３常见问题：用ｈｅｘ方法产生随机数位数不够问题，有时候位数不足６位。

４解决办法，前面补０，可以考虑用ｆｏｒ循环判断长度补０／

５编码实战：

ｈｅｘ方法

function change_color(){ return"#"+(00000+(Math.floor(Math.random()*16777216)).toString(16).slice(-6)); }

ｒｇｂ方法：

function randomRgbColor() { var r = Math.floor(Math.random() * 256); var g = Math.floor(Math.random() * 256); var b = Math.floor(Math.random() * 256); return `rgb(${r},${g},${b})`; }

6.扩展思考

如何转化颜色格式？

RGB转换为16进制

function rgb2Hex(rgb) { if (/^rgb\((\d{1,3}\,){2}\d{1,3}\)$/i.test(rgb)) { //test RGB var hex = '#'; //定义十六进制颜色变量 rgb.replace(/\d{1,3}/g, function(kw) { //提取rgb数字 kw = parseInt(kw).toString(16); //转为十六进制 kw = kw.length < 2 ? 0 + kw : kw; //判断位数，保证两位 hex += kw; //拼接 }); return hex; //返回十六进制 } else { console.log(`Input ${rgb} is wrong!`); return '#000'; //输入格式错误,返回#000 } }

16进制转化为RGB

function hex2Rgb(hex) { //十六进制转为RGB var rgb = []; // 定义rgb数组 if (/^\#[0-9A-F]{3}$/i.test(hex)) { //判断传入是否为#三位十六进制数 let sixHex = '#'; hex.replace(/[0-9A-F]/ig, function(kw) { sixHex += kw + kw; //把三位16进制数转化为六位 }); hex = sixHex; //保存回hex } if (/^#[0-9A-F]{6}$/i.test(hex)) { //判断传入是否为#六位十六进制数 hex.replace(/[0-9A-F]{2}/ig, function(kw) { rgb.push(eval('0x' + kw)); //十六进制转化为十进制并存如数组 }); return `rgb(${rgb.join(',')})`; //输出RGB格式颜色 } else { console.log(`Input ${hex} is wrong!`); return 'rgb(0,0,0)'; } }

7.参考文献

参考一：《JS编程艺术》

参考二： 豆丁网

参考三：脚本之家

8.更多讨论

大家知道RGBA属性是有透明度属性的，那么通过哪种方法可以直接把透明度也转化过来呢