2017-05-19 29 views
1

我嘗試使用bootstrap和angularjs製作可摺疊面板。我成功地收到了數據,但是我沒有把相關主體的面板標題和「id」動態地加入「href」。以下html演示了我如何嘗試分配「href和id」。

HTML

<div class="panel-group" data-ng-repeat="Art in Articles" id="accordion"> 
    <div class="panel panel-default"> 
     <div class="panel-heading"> 
      <h4 class="panel-title"> 
       <a data-toggle="collapse" data-parent="#accordion" data-ng-href="go$index"><%-- here is my problem href in runtime not working --%> 
        {{Art.Art_Title}} 
       </a> 
      </h4> 
     </div> 
     <div data-ng-id="go$index" class="panel-collapse collapse"> <%-- same problem here with related id --%> 

      <img data-ng-src="{{Art.Art_Pic}}" style="margin: 20px; border: 4px solid #FFFFFF; 
      width: 140px; height: 100px; float: left;" /> 
      <div class="panel-body" style="padding: 5px; margin: 5px; text-align: right; background-image: url('../App_Pic/bg03.jpg');"> 
        {{Art.Art_Body}} 
      </div> 
      <button type="button" class="btn btn-primary btn-sm " style="margin-bottom: 10px">Read More ...</button> 
     </div> 
    </div> 
</div> 

回答

0
data-ng-href="{{'go' + $index}}" 
data-ng-id="{{'go' + $index}}" 
1

如果你想爲一個字符串以及內側的angularjs引號 - 標記的變量組合,你需要使它像在JavaScript中有效的表達式:「串」 + $變量 <div data-ng-id="'go'+$index" class="panel-collapse collapse">