I am currently in the process of updating a web application from Angular 1 to Angular 2, and I'm facing challenges when it comes to integrating with Google Cloud Endpoints in my Angular 2 app.
I utilized the angular-cli to set up the Angular 2 project. My goal is to connect to the endpoints API from various services, so any guidance provided should take this into consideration.
Here's how I approached it in Angular 1:
In my index.html:
<script>
function init() {
console.log("Initializing Cloud Endpoints..");
window.init();
};
</script>
<script src="https://apis.google.com/js/client.js?onload=init"></script>
and in my main.js:
function Main($scope, $window){
var vm = this;
$window.init= function() {
$scope.$apply(vm.loadApi);
};
vm.loadApi = function(){
gapi.client.load('deviceStockApi', 'v1', function(){
console.log("Cloud Endpoints are now available");
}, 'https://name-of-my-endpoints-app.appspot.com/_ah/api');
}
}
Attempting the same in Angular 2:
Edit1: I'm currently focusing on getting the API to load initially, hence why all code is placed in the index.html file in the example below. However, ideally, I would prefer a more standardized solution for initiating and utilizing Cloud Endpoints within an Angular 2 application.
In my index.html:
<script src="https://apis.google.com/js/client.js?onload=init"></script>
<script>
function init() {
console.log("Init called");
gapi.client.load('deviceStockApi', 'v1', function(){
console.log("Cloud Endpoints are now available");
}, 'https://name-of-my-endpoints-app.appspot.com/_ah/api');
}
</script>
Upon running the web application, the init function is not triggered (no output in the console). Nonetheless, it appears that the script is being loaded.
https://i.sstatic.net/WFL80.png
If you have any suggestions on resolving this issue, your input would be greatly appreciated! Additionally, if you've come across any relevant documentation from Google or other sources on this topic, please feel free to share!