One effective method is to access the config section on the server-side code and retrieve it using $http.get.
To achieve this, you can create a method in your MVC ApiController or a MVC Action. This method can look something like:
[Route("settings/{key}")]
[HttpGet]
public HttpResponseMessage GetSetting(string key)
{
try
{
return Request.CreateResponse(HttpStatusCode.OK,
System.Configuration.ConfigurationManager.AppSettings[key]);
}
catch (Exception ex)
{
return Request.CreateErrorResponse(HttpStatusCode.BadRequest, ex)
}
}
In your Angular service, you can then define a function that makes use of this method:
app.service('utilsService', utilsService);
utilsServcie.$inject = ['$http'];
function utilsServcie($http){
this.readServerProperty = function(key){
$http.get('/api/v1/settings/' + key).then(
function(response){
return response.data;
},
function(error){
alert(error.data.message);
}
);
}
}
You can utilize this service in specific areas by calling it like so:
app.controller('MainController', MainController);
MainController.$inject = ['utilsServcie'];
function MainController(utilsServcie){
var vm = this;
utilsServcie.readServerProperty('SampleTemplate').then(function(path){
vm.path = path;
});
}
Finally, in your view, you can display the information retrieved from the server:
<div ng-controller="MainController as mc">
<a ng-href= "mc.path"> Edit Template</a>
</div>
This outline may contain minor errors since it was written from memory, but it provides a general idea of how to approach this solution.
That concludes the explanation! 😊