googlearchive / angularfire-seed

Seed project for AngularFire apps
http://angularfire.com
MIT License
409 stars 191 forks source link

How to inject userProvider? #50

Closed svenwoldt closed 10 years ago

svenwoldt commented 10 years ago

Hey I would like to know why this example fails

.controller("ChatCtrl", [ "$scope" "user" "messageList" ($scope, user, messageList) -> $scope.messages = messageList $scope.addMessage = (newMessage) -> $scope.messages.$add text: newMessage owner: user.uid ])

Why is it possible for you to inject user into your controllers but if I would like to attach the user to any other controller it fails with:

Error: [$injector:unpr] Unknown provider: userProvider <- user http://errors.angularjs.org/1.2.23/$injector/unpr?p0=userProvider%20%3C-%20user

Any help would be greatly appreciated and thanks for the project it has been very helpful so far. Kind regards, Sven

katowulf commented 10 years ago

Please have a look at the comments in routes.js. You'll see that we utilize the resolve method to inject the user object into the dependencies. Any route created with authRequired: true will do so by default.

You can also manually call simpleLogin.getUser() rather than using a resolve strategy.

ghost commented 10 years ago

simpleLogin.getUser() doesn't return the actual current logged in user object for me not sure why. When I do simpleLogin.getUser().email I get an undefined.

I'm unable to expose the user object globally. I have a navigation that displays the user name and also a logout button. The controller doesn't appear in routes. When I inject the user provider, I get an error, when I call simpleLogin.getUser() I don't get anything back.

Any idea how to solve this particular problem? Where you just have global access to the logged in user. Your help will be very appreciated, I have been stuck on this for 2 days and I cannot find a way out. I attached an image of my code. screen shot 2014-09-25 at 3 40 35 pm

katowulf commented 10 years ago

getUser() returns a promise as this is an asynchronous lookup. It resolves when the user object is available.

As mentioned before, check out routes.js. You'll want to utilize the resolve method to make things simple, as it will resolve the user before your controller is loaded, and make the user object available as a dependency you can inject. There is already an example for the route for / (i.e. home) and HomeCtrl that you can pretty much copy/paste.

The answer to your direct question, however, is that you get the user object from the promise. Although, just to be redundant, the resolve approach is a more sound strategy and makes your life simpler once you get the hang of it.

simpleLogin.getUser().then(function(user) {
     $scope.user = user;
});
ghost commented 10 years ago

Great! Thank you so much, it works now.

malcium commented 9 years ago

I've tried everything here and I still can't get it working. The only difference is that I'm using an ng-include inside of an ng-view. The HTML content I'm loading with the ng-include is accounts.html page, but I keep getting the user is undefined or the unknown provider errors. Could I see a shot of the version that worked for you MaherManoubi?

ghost commented 9 years ago

That's the exact code that worked for me:

simpleLogin.getUser().then(function(user) { $scope.user = user; });

You just need to understand the mechanics and you will see things clearly. Basically simpleLogin.getUser() sends a promise and that promise may load after the page is loaded. You can use then(function(user) {//code here}) so the code executes only after the promise is resolved.

If you share your code, I will tell exactly what's wrong with it.

katowulf commented 9 years ago

@malcium I've moved your questions to #57. Please troubleshoot there.