My current HTML page structure looks like this:
<body ng-controller="DashboardDisplay" onload="submit()">
<div class="container-fluid" >
{{scope.arr}}
</div>
</body>
<script>
var myApp = angular.module('myApp',[]);
myApp.controller('DashboardDisplay', ['$scope','$http',function($scope,$http) {
$scope.submit = function(){
var jsonOb = {"A":"B"};
$http.post(URL,jsonOb).
success(function(response) {
console.log('got it' + response);
$scope.arr=response;
})
}
}]);
At the moment, I have hardcoded the value of the variable jsonOb. However, for different pages, only the value of this variable changes. For example, on www.xyz.com/page1.html, jsonOb={"A":"B"}, while on www.xyz.com/page2.html, jsonOb={"1":"2"}. The rest of the HTML code remains identical. This redundancy bothers me as I am essentially using separate HTML pages just to set the value of one variable.
I am looking for a way to dynamically change the value of the variable based on the URL being queried. How can I achieve this?
Note: I am hosting the content using an express server.