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

2018-05-09  本文已影响0人  EthanTseng

在项目中,我使用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语法也懒得写。。

上一篇下一篇

猜你喜欢

热点阅读