I'm trying to use the WindowsAzure.MobileServiceClient within Angular to do single sign on and CRUD operations. Being an Angular noob, I'm trying to figure out the best way to do this:
- Instantiate it in the $rootScope in .run and call the functions from there?
- Create a service or factory and make the instantiation of the MobileServiceClient and all of the function calls in that? Would the currentUser and other information get lost when the service/factory isn't being used?
- Just spool up MobileServiceClient in the controllers that need it? Seems to me if I do it that way, currentUser info would get lost?
I've tried using some of the above methods but I'm running into some problems:
- Calling the login method as shown in the Azure docs sometimes works, other times it doesn't show a popup window to the authentication provider like it should. I am logged off of the authentication provider so a popup window should be shown but isn't,
- No matter what I try to do, the MobileServiceClient currentUser is coming back as null, even when the popup was shown and I correctly entered my credentials.
Any ideas of what I can do to make this work smoothly? Any examples I can follow somewhere? The documentation seems sketchy.
I'm using Yeoman and the angular generator along with Grunt to do my work, if it makes any difference.
I was able to figure it out. I created a new service to handle all of the mobile services code. Since the methods from the client are async, I'm using callbacks in the methods. I also use the cookie store to save the user's credential object (currentUser) and pull it out again when needed. currentUser seems to lose the user credential object between calls, so I store it in a cookie and push it into the client when it has lost it.
In the controller that does the login and logout, I do this:
The view for the login/logout controller looks like this:
And finally in a controller that gets data, I do this:
Just for someone who search ready-to-use solution https://github.com/TerryMooreII/angular-azure-mobile-service
This is angularjs service which implement below methods:
Just add 'azure-mobile-service.module' in your dependency list and configure api keys:
and then: