Включить внешний код в угловой проект

Question

Я пытаюсь включить некоторый внешний код в угловой проект, который я начал работать недавно. Я хотел бы добавить конфетти анимации к проекту

http://jsfiddle.net/vxP5q/61/?utm_source=website&utm_medium=embed&utm_campaign=vxP5q

I created a route for the page I need to create in app.js 
    $stateProvider.state('result', { 
    url: '/result', 
    templateUrl: 'templates/result_election.html', 
    controller: 'ElectionCtrl' 
    }) 

Поскольку эта страница связана с ElectionCtrl я вставил код с скрипки в ElectionCtrl, но это не оказывает никакого влияния на моя страница. Скрипку код включен в это:

angular.module('election',[]).controller('ElectionCtrl', function($http, $scope, $ionicPopup, $localStorage, $location, $stateParams ,$ionicLoading){}) 

Answer 1

код связан только стандартный JavaScript, который ищет <canvas id="canvas"></canvas> и вставляет анимацию, на $(document).ready. Чтобы использовать это в угловой частичной части, должно произойти несколько вещей.

Во-первых, частичный шаблон 'templates/result_election.html' должен иметь элемент canvas.

Во-вторых, код в $(document.ready) должны быть перемещены в функцию, которую можно назвать в $stateChangeSuccess из ui-router, так как canvas должен присутствовать на странице для функции, чтобы найти его.

Более сложной формой этого будет создание директивы, которая содержит шаблон и код, который должен быть выполнен в фазе $compile.