Access Angular $scope in plain javascript

Question

I have a Controller which has something like this...

angular.module('kZoneApp').controller('DemandController', ['$http', '$scope', '$rootScope', 'dataFactory', '$window', '$routeParams','$sce', function ($http, $scope,$rootScope, dataFactory, $window, $routeParams,$sce) {
 $scope.channel = $routeParams.channel;

now within my page.html, I want to do the following....

<script>
 YoutubeVideoPlayer.openVideo('{{channel}}');
</script>

please note, I am using Routes, and page.html is loaded into my ng-view Via a Route.

<div id="myView" class="reveal-animation" ng-view></div>

I tried below code, but it returns undefined....

$().ready(function () {
 var channel = angular.element("#myView").scope().channel 
 YoutubeVideoPlayer.openVideo(channel);
})

How can I get the value of Channel within my Template View?

Update

below works...but I am sure there has to be a cleaner solution

 setTimeout(function () {
 alert(angular.element("#myView").scope().channel)
 }, 500);

• uowzd01: try change it to var channel = angular.element(document.getElementById("myView")).scope().channel
• Callum Linington: You should do it the other way round, make YoutubeVideoPlayer a constant in Angular. anuglar.module('someModule').constant('YouTube', YoutubeVideoPlayer) then access in a directive.
• user2404597: same result. see my update
• user2404597: Callum, could you please write a quick example?
• Callum Linington: plnkr example

Answer 1

A workaround solution should be creating a variable before your Angular.module definition.

var scopeInAngular = null;

and inside controller assign controller to your variable.

scopeInAngular = $scope;

then if you manipulate anything inside angular view use

scopeInAngular.$apply();

• user2404597: This worked. But still had to be placed within the setTimeout command.