我正在寻找一种方法来将服务结构中的参数读入我的angular 2应用程序。例如,我希望能够根据service fabric参数config xml文件中的值设置api端点和环境名称(以显示我们所处的环境)。我还没有找到解决这个问题的简单而优雅的解决方案。
我目前的解决方法是使用Asp.Net控制器来提供静态角度,以便将角度配置中的值设置为ViewBag对象。
public IActionResult Index()
{
var apiUrl = _configurationPackage.Settings.Sections["Spa_Configuration"].Parameters["apiUrl"].Value;
var environmentName = _configurationPackage.Settings.Sections["Spa_Configuration"].Parameters["environmentName"].Value;
ViewBag.apiUrl = apiUrl;
ViewBag.environmentName = environmentName;
return View();
}
然后我通过在Index.cshtml中调用window.onload上的javascript函数将这些值添加到会话存储中。
<script>
function codeAddress() {
var environmentName = '@ViewBag.environmentName';
var myJsVariable = '@ViewBag.apiUrl';
console.log(environmentName);
sessionStorage.setItem('apiUrl', myJsVariable);
sessionStorage.setItem('environmentName', environmentName);
console.log(sessionStorage);
}
window.onload = codeAddress;
</script>
然后我在角度控制器中使用这些变量,如下所示:
@Injectable()
export class HttpService {
constructor(private _httpClient: HttpClient, private _http: Http) { }
private baseUrl = sessionStorage.getItem('apiUrl');
这种方法似乎达到了一定程度。问题是当app加载environmentName和apiUrl时似乎没有正确设置。只有当我点击刷新时,这些似乎才会被设置并且应用程序按预期工作。
这种方法的另一个问题是,每次我构建角度应用程序时,我必须手动将polyfill,内联主等js文件输入到Index.cshtml文件中,这是一个痛苦而且看起来不像解决问题的正确方法。
所以有人知道我在这里做错了什么。我并不觉得我采取了正确的方法,因此对于替代方法的任何建议都会受到高度赞赏。
感谢。