javascript - Need help to add chart js to modal window -

here diagram made chart

<div class="diagram"> <canvas id="pie" class="chart chart-pie" width="150" height="150" data="modalobj.functionaltest" labels="labels" colours="colours"> </canvas> 

this directive

.directive('modal', function () {     return {         template: '<ng-include src="gettemplateurl()"/>',         restrict: 'e',         controller: function($scope) {             //function used on ng-include resolve template             $scope.gettemplateurl = function() {                 return $scope.path;             }         }     }}); 

besides have add diagram in modal if template url needs it, not templates use chart

demo: http://jsfiddle.net/softvar/9cf47fe1/1/

html:

<div ng-app="myapp">     <!-- button trigger modal -->     <button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#mymodal">       launch demo modal     </button>      <!-- modal -->     <div class="modal fade" id="mymodal" tabindex="-1" role="dialog" aria-labelledby="mymodallabel" aria-hidden="true">       <div class="modal-dialog">         <div class="modal-content">           <div class="modal-header">             <button type="button" class="close" data-dismiss="modal" aria-label="close"><span aria-hidden="true">&times;</span></button>             <h4 class="modal-title" id="mymodallabel">modal title</h4>           </div>           <div class="modal-body">               <elem-modal></elem-modal>           </div>           <div class="modal-footer">             <button type="button" class="btn btn-default" data-dismiss="modal">close</button>             <button type="button" class="btn btn-primary">save changes</button>           </div>         </div>       </div>     </div> </div> 

js:

var app = angular.module('myapp', []); app.directive('elemmodal', function () {     return {         template: '<p>test</p><ng-include src="gettemplateurl()"/>',         restrict: 'e',         controller: function($scope) {             //function used on ng-include resolve template             $scope.gettemplateurl = function() {                 return $scope.path;             }         },         link: function (scope) {             console.log(scope)         }     }});