AngularJS with MODX, getting JSON content

<script src="assets/templates/gulp_h5bp/js/vendor/angular.js"></script>
  <script src="assets/templates/gulp_h5bp/js/vendor/angular-route.js"></script>
  <script>
    // create the module and name it DESIGNfromWITHIN
	var DESIGNfromWITHIN = angular.module('DESIGNfromWITHIN', ['ngRoute']);

	DESIGNfromWITHIN.config(function($sceProvider) {
		$sceProvider.enabled(false);
	});

	DESIGNfromWITHIN.config(function($locationProvider) {
		$locationProvider.html5Mode(true);
		$locationProvider.hashPrefix('!');
	});

	// configure our routes
	DESIGNfromWITHIN.config(function($routeProvider) {
		$routeProvider
		// route for the home page
		.when('/', {
			templateUrl : 'assets/templates/gulp_h5bp/pages/home.html',
			controller  : 'mainController'
		})
		// route for the test page
		.when('/contact.html', {
			templateUrl : 'assets/templates/gulp_h5bp/pages/contact.html',
			controller  : 'contactController'
		})
		// route for the post page
		.when('/blog.html', {
			templateUrl : 'assets/templates/gulp_h5bp/pages/post_overview.html',
			controller  : 'blogController'
		})
		// route for the post page
		.when('/blog/:postName.html', {
			templateUrl : 'assets/templates/gulp_h5bp/pages/post.html',
			controller  : 'postController'
		})
		.otherwise({ 
			redirectTo: '/'
		});
	});

	// create the controller and inject Angular's $scope
	DESIGNfromWITHIN.controller('mainController', function($scope, $http) {
	$http.get('[[~1]]')
		.then(function(res){
			$scope.message = res.data;              
		});
	});

	// create the controller and inject Angular's $scope
	DESIGNfromWITHIN.controller('blogController', function($scope, $http) {
	$http.get('[[~20]]')
		.then(function(res){
	 		$scope.message = res.data;              
		});
	});

	DESIGNfromWITHIN.controller('postController', function($scope, $http, $routeParams) {
		$http.get('[[~20]]' + $routeParams.postName + '.html')
		.then(function(res){
			$scope.message = res.data;             
		});
	});


	DESIGNfromWITHIN.controller('contactController', function($scope, $http) {
		$http.get('http://designfromwithin.com/assets/templates/gulp_h5bp/package.json')
		.then(function(res){
			$scope.message = res.data;            
		});
	});
	</script>

.factory('utils', function () {

    return {

      // Util for finding an object by its 'id' property among an array
      findById: function findById(a, id) {
        for (var i = 0; i < a.length; i++) {
          if (a[i].id == id) return a[i];
        }
        return null;
      },

      findByAlias: function findByAlias(a, id) {
        for (var i = 0; i < a.length; i++) {
          if (a[i].alias == id) return a[i];
        }
        return null;
      }
    };

  });

.state('blog.detail', {
			url: "/:alias",
			views: {
				'mainBlog': {
					templateUrl: 'pages/blog.detail.html',
					controller: ['$scope', '$stateParams', 'utils',
					function (  $scope,   $stateParams,   utils) {
						$scope.item = utils.findByAlias($scope.blogposts, $stateParams.alias);
					}]
				},
			},
		})

# html5 pushstate (history) support:
<ifModule mod_rewrite.c>
RewriteEngine on


# Rewrite "domain.com/foo/ -> domain.com/foo"
  RewriteRule ^(.*)/$ /$1 [R=301,L]

# The Friendly URLs part
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ index.php?q=$1 [L,QSA]
</ifModule>

<span ng-bind-html="trustHTML(tool.toolDocs)"></span>

<script>
'use strict'; 
var toolApp = angular.module('toolApp', ['ngSanitize', 'ngDialog']);

toolApp.controller('ToolController', function($scope, $sce, $window, ngDialog) {
    
    $scope.toolList = [[$toolsJSONListTpl]]; //JSON List

    $scope.trustHTML = function(input) {
       return $sce.trustAsHtml(input);
    };

});
</script>

  

{
  "pageTitle":"[[+pagetitle]]",
  "toolId":"[[+id]]",
  "toolType":"[[+tv.tool-type]]",
  "toolImg":"[[+tv.tool-img]]",
  "toolMsg":"[[!jsonEncode? &jsonInput=`[[+tv.tool-msg]]`]]",
  "toolStages":"[[!jsonEncode? &jsonInput=`[[+tv.tool-stages]]`]]",
  "toolNotes":"[[!jsonEncode? &jsonInput=`[[+tv.tool-notes]]`]]",
  "toolInventory":"[[+tv.tool-inventory]]",
  "toolDocs":"[[!jsonEncode? &jsonInput=`[[!getResources? &parents=`[[+id]]` &tpl=`toolDocTpl` &limit=`4` &includeTVs=`1`]]`]]",
  "toolZoom":"[[+tv.tool-zoom]]"
},

angular.module('myApp').directive('compileTemplate', function ($compile, $parse) {
	return {
		link: function (scope, element, attr) {
			var parsed = $parse(attr.ngBindHtml);

			function getStringValue() {
				return (parsed(scope) || '').toString();
			}

			//Recompile if the template changes
			scope.$watch(getStringValue, function () {
				$compile(element, null, -9999)(scope);  //The -9999 makes it skip directives so that we do not recompile ourselves
			});
		}
	}
});

angular.module('myApp').filter('unsafe', function ($sce) {
	return function (val) {
		return $sce.trustAsHtml(val);
	};
});

<p ng-bind-html="items.content | unsafe" compile-template> </p>