>

나는 nav-tab 후에  URL 변경은 포함되지 않지만 탭은 변경되고 관련 정보가 표시됩니다.

와이즈 비즈가있다  사이트를 새로 고침 할 때마다 사용자가 검색 페이지로 돌아갑니다. 일반적인 트위터 부트 스트랩 angularjs 로  이 URL을 사용할 수 없지만 URL을 변경하고 싶습니다.

질문은 :

<올> 누구든지 트위터 부트 스트랩 nav-tabs 를 사용하여이 작업을 수행하는 방법을 알고 있습니까
  • 그렇지 않으면 사용할 수있는 다른 것이 있습니까?
  • 아래 코드가 잘립니다 :

    nav-tabs
    
    

    각 탭은 사용자에게 정보 차트를 표시합니다.

    <div class="row" data-ng-if="showcharts"> <div class="col-md-12"> <!-- Nav tabs --> <ul class="nav nav-tabs" role="tablist"> <li role="presentation" class="active"><a href="#productBreakdown" role="tab" data-toggle="tab"><span class="tabHeadings">Product breakdown</span></a></li> <li role="presentation" style="border-right: 1px solid lightgray; border-left: 1px solid lightgray"><a href="#assetsBreakdown" role="tab" data-toggle="tab"><span class="tabHeadings">Assets Breakdown</span></a></li> <li role="presentation"><a href="#nbBreakdown" role="tab" data-toggle="tab"><span class="tabHeadings">New Business Breakdown</span></a></li> </ul> <!-- Tab panes --> <div class="tab-content"> <div role="tabpanel" class="tab-pane active" id="productBreakdown"> <donutchart id="product-breakdown" data-options="productbreakdownchart"></donutchart> </div> <div role="tabpanel" class="tab-pane" id="assetsBreakdown"> <donutchart id="asset-breakdown" data-options="assetbreakdownchart"></donutchart> </div> <div role="tabpanel" class="tab-pane" id="messages">TO BE ADDED</div> </div> </div> </div>

    • 답변 # 1

      댓글에서 말한 것처럼 href 로 인해 URL이 변경됩니다.   <a> 의 속성  꼬리표. 그러나 당신은 href 를 떠날 수 있습니다  빈 사용 data-target="..."  대신 속성. 그래서

      <a href="#productBreakdown" role="tab" data-toggle="tab"></a>
      
      

      있을 것이다

      <a href data-target="#productBreakdown" role="tab" data-toggle="tab"></a>
      
      

    • 답변 # 2

      제안한대로 올바르게 작동한다고 생각하지만 작동시킬 수 없습니다! 무엇이 잘못되었는지 아십니까?

      <div role="tabpanel">
                  <!-- Nav tabs -->
                  <ul class="nav nav-tabs" role="tablist">
                      <li role="presentation" class="active">
                        <a href data-target="#uploadTab"  role="tab" data-toggle="tab">Upload</a>
                      </li>
                      <li role="presentation">
                        <a href data-target="#browseTab"  role="tab" data-toggle="tab">Browse</a>
                      </li>
                  </ul>
                  <!-- Tab panes -->
                  <div class="tab-content">
                      <div role="tabpanel" class="tab-pane active" id="uploadTab">upload Tab</div>
                      <div role="tabpanel" class="tab-pane" id="browseTab">browseTab</div>
                  </div>
              </div>
      
      

    관련 자료

  • 이전 mysql - jdbc 구성을 사용한 스프링 세션 - 'testspring_session'테이블이 없습니다
  • 다음 ios - 기존 Xcode 프로젝트에 단위 테스트 대상 추가, 번들에서 자원을 찾을 수 없음