Passing javascript variables from controller to partial file in AngularJs

Question

I am new to AngularJs. I have put a url value in the scope variable inside a controller. This value should be used in the partial file corresponding to the controller inside a javascript function. How can I achieve this in AngularJs.

Code snippet is given below for reference: Config code:

myApp.config(function ($routeProvider){
  $routeProvider.
   when('/state-details/:id',
   {
      controller:'controllers.StateDetailsCtrl',
      templateUrl:'/partials/state-details.html'
   })
   .... More routes defined below...

Inside the controller:

controllers.StateDetailsCtrl= function($scope, $routeParams, $http){
  $scope.testURL='http://www.google.com'
  .... More values set in the scope..

Inside the state-details partial file:

<script>
// how to get the value of the testURL defined in the scope?
</script>

Please let me know how to get this working?

Answer 1

If you need to add additional javascript into a partial html file, then it just like screams to use a directive.

There you can inherit the whole ctrl scope or create a isolated scope.

https://docs.angularjs.org/guide/directive