ng-view显示了引导数据表的奇怪行为

时间:2018-03-21 12:33:22

标签: angularjs datatables bootstrap-4 ng-view

我第一次在项目中使用了现成的模板。

这是该主题的链接https://colorlib.com/polygon/adminator/index.html



每当我尝试将该主题的数据表加载到ng-view时,它会加载除此之外的所有内容。

enter image description here



以下是enter image description here

的快照



但是当我正常使用它时(没有使用ngView),一切都很好, enter image description here

这是index.html文件的代码段

<main class="main-content bgc-grey-100">
            <!--<h1> ng-view content</h1>-->
            <div ng-view id="mainContent" > <!-- whenever I remove the ngview and just paste the code below in this section, it works fine -->

            </div>

        </main> <!-- main ends --><br><br>

我正在加载的部分模板具有以下代码。

 <div class="container-fluid">
            <h4 class="c-grey-900 mT-10 mB-30">Data Tables</h4>
            <div class="row">
              <div class="col-md-12">
                <div class="bgc-white bd bdrs-3 p-20 mB-20">
                  <h4 class="c-grey-900 mB-20">Bootstrap Data Table</h4>
                  <table id="dataTable" class="table table-striped table-bordered" cellspacing="0" width="100%">
                    <thead>
                      <tr>
                        <th>Name</th>
                        <th>Position</th>
                        <th>Office</th>
                        <th>Age</th>
                        <th>Start date</th>
                        <th>Salary</th>
                      </tr>
                    </thead>
                    <tfoot>
                      <tr>
                        <th>Name</th>
                        <th>Position</th>
                        <th>Office</th>
                        <th>Age</th>
                        <th>Start date</th>
                        <th>Salary</th>
                      </tr>
                    </tfoot>
                    <tbody>
                      <tr>
                        <td>Tiger Nixon</td>
                        <td>System Architect</td>
                        <td>Edinburgh</td>
                        <td>61</td>
                        <td>2011/04/25</td>
                        <td>$320,800</td>
                      </tr>
                      <tr>
                        <td>Garrett Winters</td>
                        <td>Accountant</td>
                        <td>Tokyo</td>
                        <td>63</td>
                        <td>2011/07/25</td>
                        <td>$170,750</td>
                      </tr>
                      <tr>
                        <td>Ashton Cox</td>
                        <td>Junior Technical Author</td>
                        <td>San Francisco</td>
                        <td>66</td>
                        <td>2009/01/12</td>
                        <td>$86,000</td>
                      </tr>
                      <tr>
                        <td>Cedric Kelly</td>
                        <td>Senior Javascript Developer</td>
                        <td>Edinburgh</td>
                        <td>22</td>
                        <td>2012/03/29</td>
                        <td>$433,060</td>
                      </tr>
                      <tr>
                        <td>Airi Satou</td>
                        <td>Accountant</td>
                        <td>Tokyo</td>
                        <td>33</td>
                        <td>2008/11/28</td>
                        <td>$162,700</td>
                      </tr>
                      <tr>
                        <td>Brielle Williamson</td>
                        <td>Integration Specialist</td>
                        <td>New York</td>
                        <td>61</td>
                        <td>2012/12/02</td>
                        <td>$372,000</td>
                      </tr>
                      <tr>
                        <td>Herrod Chandler</td>
                        <td>Sales Assistant</td>
                        <td>San Francisco</td>
                        <td>59</td>
                        <td>2012/08/06</td>
                        <td>$137,500</td>
                      </tr>
                      <tr>
                        <td>Rhona Davidson</td>
                        <td>Integration Specialist</td>
                        <td>Tokyo</td>
                        <td>55</td>
                        <td>2010/10/14</td>
                        <td>$327,900</td>
                      </tr>
                      <tr>
                        <td>Colleen Hurst</td>
                        <td>Javascript Developer</td>
                        <td>San Francisco</td>
                        <td>39</td>
                        <td>2009/09/15</td>
                        <td>$205,500</td>
                      </tr>
                      <tr>
                        <td>Sonya Frost</td>
                        <td>Software Engineer</td>
                        <td>Edinburgh</td>
                        <td>23</td>
                        <td>2008/12/13</td>
                        <td>$103,600</td>
                      </tr>
                      <tr>
                        <td>Jena Gaines</td>
                        <td>Office Manager</td>
                        <td>London</td>
                        <td>30</td>
                        <td>2008/12/19</td>
                        <td>$90,560</td>
                      </tr>
                    </tbody>
                  </table>
                </div>
              </div>
            </div>
          </div>



我是AngularJs的初学者。我不知道这是怎么回事。这是我能够解决问题的最佳方式。如果有任何遗漏,请告知我。请帮我解决这个问题。

1 个答案:

答案 0 :(得分:0)

while (true) { try { ZMQ.Context context = ZMQ.context(1); // Connect to server ZMQ.Socket requester = context.socket( ZMQ.REQ ); String address = "tcp://xxx.xx.xx.xx"; int port = 5000; requester.connect( address + ":" + port ); ... } ... } 通常用于路由。如果您想在其他页面中包含html模板,我建议您使用ng-view

ng-include

注意:文件路径必须在单引号内,因为<div ng-include src="'/path/to/the/file.html'"></div>需要一个字符串。

When to use ng-view and ng-include