美文网首页
关于AngularJS ng-repeat循环中取到页面中的值

关于AngularJS ng-repeat循环中取到页面中的值

作者: EthanTseng | 来源:发表于2018-05-09 09:00 被阅读0次

    在项目中,我使用AngularJS去实现静态页面传值;最初在ng-repeat循环在页面上填充json值的时候,我使用id选择器去拿到循环中的某个值,但是页面中的id是唯一的,所以不能这样去实现。
    HTML代码

    <table class="sharesTable">
                <tr style="width: 100%">
                    <td class="tdStyle">stockCode</td>
                    <td class="tdStyle">stickFlag</td>
                    <td class="tdStyle">stickFlag</td>
                    <td class="tdStyle">
                        <div onclick="showDetail()">Detail</div>
                    </td>
                </tr>
                <tr ng-repeat="m in myPositiondata">
                    <td class="tdStyle">
                        <div>{{m.stockname}}</div>
                        <div id="freestockCode" name="freestockCode">{{m.stockcode}}</div>
                    </td>
                    <td class="tdStyle">{{m.stickflag}}</td>
                    <td class="tdStyle">{{m.stickflag}}</td>
                    <td class="tdStyle"><a href="javascript:void(0)" onclick="showDetail(this)" >查看详情</a></td>
                </tr>
    </table>
    

    JS代码

          function showDetail() {
              var stockCode = $('freestockCode').html();
              var url = "./sharesDetail.html?stockCode=" + stockCode;
              //console.log(stockCode);
              location.href = url;
          };
    

    后来我总算学会了如何去爱,不是,后来大佬教我这样做去传值,在我的<a>标签中定义一个data,把{{}}包括里面的内容加进去,在function的()内加上this,js中就可以通过$(_this).attr("data")得到相应循环数据中的值了:
    HTML代码

    <table class="sharesTable">
                <tr style="width: 100%">
                    <td class="tdStyle">stockCode</td>
                    <td class="tdStyle">stickFlag</td>
                    <td class="tdStyle">stickFlag</td>
                    <td class="tdStyle">
                        <div onclick="showDetail()">Detail</div>
                    </td>
                </tr>
                <tr ng-repeat="m in myPositiondata">
                    <td class="tdStyle">
                        <div>{{m.stockname}}</div>
                        <div id="freestockCode" name="freestockCode">{{m.stockcode}}</div>
                    </td>
                    <td class="tdStyle">{{m.stickflag}}</td>
                    <td class="tdStyle">{{m.stickflag}}</td>
                    <td class="tdStyle"><a href="javascript:void(0)" onclick="showDetail(this)" data="{{m.stockcode}}" >查看详情</a></td>
                </tr>
    </table>
    

    JS代码

         function showDetail(_this) {
              //$(_this).attr("data");
              var stockCode = $(_this).attr("data");
              var url = "./sharesDetail.html?stockCode=" + stockCode;
              //console.log(stockCode);
              location.href = url;
          };
    

    这样ng-repeat循环内的值就可以传到JS内了。
    作为一个后端,表示写这种前端也只能写成这个ABCD样;自己简单的记一下MD语法也懒得写。。

    相关文章

      网友评论

          本文标题:关于AngularJS ng-repeat循环中取到页面中的值

          本文链接:https://www.haomeiwen.com/subject/kdzgrftx.html