bg-render+bg-class+filter

重点：

1、多层render写法参数下面的html代码段，外层bg-render---><script type='text/html'>--->{{for}}--->bg-class。

2、把逻辑处理放在js中写，例如下列的filter应用，原放在页面中写，但页面主要用于数据显示，不适合放大量逻辑处理。

 

 

易错点:

1、检查数据源类型或引用不对。

2、bg-***内不可写花括号。

3、item有没有写成了i 。

 

 

    <ul bg-render-sync="item in tiListData">
        <script type="text/html">
            {{for i in item.examOptions}}
                <li bg-class="i.eoSequence | option:[item.examTitle.answer,item.examTitle.rightAnswer,tiList.isTimeOut]"> {{i.eoSequence}}</li>
            {{/for}}
        </script>
    </ul>

 bingo.filter('option', function() {
        return function (val,parm) {
            var flag = '';
            /*
                 超时则显示正确答案，未超时只能查看自己的作答
                 parm[0]  我的答案
                 parm[1]  正确答案
                 parm[2]  是否超时
             */
            if(parm[2]) {
                // 超时
                if (val == parm[0]) {
                    flag = false;
                }else if(val == parm[1]){
                    flag = true;
                };
            }else{
                // 未超时
                if (val == parm[0]) {
                    if (val == parm[1]) {
                        flag = true;
                    } else {
                        flag = false;
                    }
                };
            };
            return flag+' item';
        }
    });

 

    var action1 = bingo.action(function($view){
        var txt = '{"rightRate":null,"examCount":1,"examList":[{"examOptions":[{"id":"b1f177b0-3b58-4a88-9eef-957837571e10","examId":"02eabfcc-547c-4d14-a05d-39a5f442d269","eoSequence":"A","eoName":"三边垂直平分线的交点","eoOrder":1,"eoNameBak":null},{"id":"3b8fceeb-1eaa-4eeb-8637-a4e43d188b2c","examId":"02eabfcc-547c-4d14-a05d-39a5f442d269","eoSequence":"B","eoName":"三条内角平分线的交点","eoOrder":2,"eoNameBak":null},{"id":"d27064d8-d891-47dc-9552-ef3cbad0f04d","examId":"02eabfcc-547c-4d14-a05d-39a5f442d269","eoSequence":"C","eoName":"三条高线的交点","eoOrder":3,"eoNameBak":null},{"id":"1622aa66-e2dc-4bfe-b3a5-0fe44c154589","examId":"02eabfcc-547c-4d14-a05d-39a5f442d269","eoSequence":"D","eoName":"三条中线的交点","eoOrder":4,"eoNameBak":null}],"examTitle":{"id":"02eabfcc-547c-4d14-a05d-39a5f442d269","isRight":0,"rightAnswer":"A","answer":"C","explain":null,"examName":"到三角形三个顶点距离相等的点是 \\((\\qquad)\\)","costTime":3},"userHomeWorkExamId":"ea6f2949-bb4e-4034-bbf4-e1af5c8de015"}],"chapterNames":["第十一章 三角形","第十一章 三角形"],"count":26,"page":{"currentPage":1,"totalPages":1,"pageSize":10,"totalRows":1,"pageStartRow":0,"pageEndRow":10,"hasNextPage":false,"hasPreviousPage":false,"nextPage":0,"previousPage":1,"pageList":[],"page":1},"taskState":2,"endDate":1472216345000,"isTimeOut":1,"finishCount":1,"taskName":"111"}';
        $view.tiList = eval('('+txt+')');
        $view.tiListData = $view.tiList.examList[0];
        console.log('你选择了',$view.tiList.examList[0].examTitle.answer);
        $view.$update();
    });