Chart.js with Angular using ng-include. Charts do not appear

1

Hello.

In my index.html I have this

    <div ng-include="'graficos.html'">
        </div>

In graficost.html I have this:

  <div class="row">
          <div class="col-md-6 col-sm-6 col-xs-12">
            <div class="x_panel">
              <div class="x_title">
                <h2>Line graph<small>Sessions</small></h2>
                <ul class="nav navbar-right panel_toolbox">
                  <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                  </li>
                  <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
                    <ul class="dropdown-menu" role="menu">
                      <li><a href="#">Settings 1</a>
                      </li>
                      <li><a href="#">Settings 2</a>
                      </li>
                    </ul>
                  </li>
                  <li><a class="close-link"><i class="fa fa-close"></i></a>
                  </li>
                </ul>
                <div class="clearfix"></div>
              </div>
              <div class="x_content">
                <canvas id="lineChart"></canvas>
              </div>
            </div>
          </div>
        </div>

In the body of index.html I declare the chart.js and the graph.js (where I create the graphs) like this:

  <script src="../vendors/Chart.js/dist/Chart.min.js"></script>

<script src="graficos.js"></script>

When I call index.html, it renders the graphics.html page called by ng-include but I get this error in the Chrome console:

  

Chart.min.js: 13 Uncaught TypeError: Can not read property 'length' of null

So it does not show the graphics that are in the graphics.js

    
asked by anonymous 20.05.2016 / 16:23

1 answer

0

Check how the scope is in your application. See where the controller is injected, if it is not injected correctly the canvas will not fetch the data.

Use ng-controller within ng-include or even within the included file or use the routes to inject it.

    
20.05.2016 / 16:44