checkbox的回显, 打上对勾却无法保存到后台用模拟点击解决 ,等问题总结angluarjs

checkbox的前台展示

先看一下完成的界面吧

点击选择标志, 下面的图片选择会出现, 然后点击要选择的图片, 就可以点下面的保存来实现保存图片的url ,这里的url是后台存的图片的路径, 前端展示的图片是存在前端, 是两个不同的路径, 下面是html的节选

 <label>
 <input name="picCheck"
             ng-model="pieCtrl.riskPoint.pic.pic1"  type="checkbox" value="/template/biaozhi/forbid/禁止乘人.jpg"
 ng-true-value="'/template/biaozhi/forbid/禁止乘人.jpg'" />
 <img src="../../../../images/biaoshi/forbid/禁止乘人.jpg" height="100" width="120"/> 
 </label>

这里有一个value 和一个ng-true-value , 当时写代码时候不知道为什么, 只写value的话, 得到的一直是true,而不是里面的值, 以后有时间研究一下, ng-true-value的话如果选择了,就可以传的是引号里面的内容了, 也有ng-false-value但这里用不到,可以想用的话百度

js中的处理就很多地方要注意了

//拆分为字符串数组
var checkArray =ctrl.riskPoint.url.split(",");
var checkBoxAll = $("input[name='picCheck']");
   for(var i=0;i<checkArray.length;i++){
       $.each(checkBoxAll,function(j,checkbox){
             var checkValue=$(checkbox).val();
        if(checkArray[i].localeCompare(checkValue)==0){
           //$(checkbox).attr("ng-checked",true);
           // $(checkbox).prop("checked",true);
           checkbox.click();//模拟点击
           // $(checkbox).prop("ng-checked",true);
         }
     })
}

1.之前在杂记里有java处理带逗号的string, 这会遇到前台需要处理的了, 方法一样的
2.$(“input[name=’picCheck’]”); 这个东西就是根据name 来获取前台的组件, 看样子是可以循环的
3.这里虽然没有用到 .attr 和 .prop 但是尝试的时候学习到了 ,
对于HTML元素本身就带有的固有属性 用 prop
对于HTML元素我们自己定义的DOM属性 用 attr
4. checkbox.click() 这个方法是偶然发现的

1. checkArray[i].localeCompare(checkValue)==0
   这句话的判断是长字符串判断方法, 一开始用的 == 和 equals 的,突然在网上找到这个方法, 试试 效果还不错, 如果相等就会 等于零, 不然会大于或者小于0 ,可能原理是把字母换成数字编码来比较吧