Как сделать глобальные переменные в angularJS

Question

У меня есть эта проблема, когда при регистрации вы попадаете на страницу «Пользователи». И его предположим, сказать: «Добро пожаловать» Имя пользователя, доцент показать на на веб-странице по причине им не уверен ... пожалуйста, помогите здесь является plunkr:

http://plnkr.co/edit/qB3Gkeq5ji1YQyy0kpGH?p=preview

Пожалуйста, мне нужна помощь ..

мне нужно получить код для plunker так: script.js:

var app = angular.module('LoginApp', ["firebase", "ngRoute"]) 

app.config(function ($routeProvider) { 
    $routeProvider 
     .when('/', { 
     templateUrl: 'registration.html', 
     controller: 'AuthCtrl' 
     }) 
     .when('/logIn', { 
     templateUrl: 'login.html', 
     controller: 'AuthCtrl' 
     }) 

     .when('/User', { 
     templateUrl: "User.html", 
     controller: 'AuthCtrl' 
     }) 
     .otherwise({ 
     redirectTo: '/' 
     }); 


    }); 


app.factory("Auth", ["$firebaseAuth", 
    function($firebaseAuth) { 
    var ref = new Firebase("https://uniquecoders.firebaseio.com/"); 
    return $firebaseAuth(ref); 
    } 
]); 


app.controller("AuthCtrl", ["$scope", "Auth", 
    function($scope, Auth) { 


     $scope.createUser = function() { 

     $scope.message = null; 
     $scope.error = null; 
    var ref2 = new Firebase("https://uniquecoders.firebaseio.com/"); 
    ref2.createUser({ 
    email: $scope.email, 
    password: $scope.password 
    }, function(error, userData) { 
    if (error) { 
     switch (error.code) { 
     case "EMAIL_TAKEN": 
      alert("The new user account cannot be created because the email is already in use. Try to login"); 
      break; 
     case "INVALID_EMAIL": 
      alert("The specified email is not a valid email."); 
      break; 
     case "INVALID_PASSWORD": 
      alert("The Specified Passowrd Is not valid.") 
      break; 
     default: 
      alert("Error creating user:", error); 
     } 
    } else { 
     alert("Successfully created user account with uid:", userData.uid); 
     alert($scope.UserName) 

     window.location.hash = "/User" 
     $scope.usernames = "HEY" 
    } 
    }); 


     }; 

     $scope.logIn = function(){ 
     $scope.message = null; 
     $scope.error = null; 

     ref2.authWithPassword({ 
      "email" : $scope.logInemail, 
      "password" : $scope.logInemailpassword 

     }, function(error, userData){ 

      if(error){ 
      alert("Login Failed.") 
      console.log(error) 
      } 
      else{ 
      alert("Logged In!") 
      } 

     }) 

     } 

    /* $scope.removeUser = function() { 
     $scope.message = null; 
     $scope.error = null; 

     Auth.$removeUser({ 
     email: $scope.email, 
     password: $scope.password 
     }).then(function() { 
     $scope.message = "User removed"; 
     }).catch(function(error) { 
     $scope.error = error; 
     }); 
    };*/ 
    } 
]); 

Answer 1

Есть в вашем коде много вещей, которые вы могли бы хотеть заботиться, но некоторые быстрые и частично грязные решения:

Не включайте все ваши файлов JavaScript на ваших вложенных шаблонов. Все, что направлено в ваш ng-view, должно быть просто html, который вы хотите вставить в этот <div>. Нет ссылок CSS, нет тегов скриптов, ничего, кроме HTML, которые обычно находятся в теле страницы.

На вашей странице регистрации ваше имя пользователя ng-model должно соответствовать тому, что вы передаете в качестве аргумента для своего ng-click. Поэтому вместо ng-model="userName" вам нужно, чтобы оно было ng-model="username", чтобы оно соответствовало ng-click="createUser(username, email, password)".

Другой важной проблемой является то, что $scope перезаписывается каждый раз, когда вы меняете представления, потому что каждый из ваших маршрутов имеет один и тот же контроллер. Так что концептуально вы можете подумать, что username (который вы сохранили как множественное число $scope.usernames по какой-либо причине) есть для вас доступ еще на $scope. Но это не так, поскольку каждое представление работает на своем собственном уникальном экземпляре Auth Controller. Самое быстрое решение, так как вы не знаете, как реализовать услуги, вероятно, нужно ввести $rootScope в ваш контроллер, а затем поставить usernames на $rootScope вместо $scope (хотя иметь в виду, используя $rootScope в производстве считается плохой практикой), так как $ rootScope будет сохраняйте все ваши контроллеры.Так что ваш Javascript файл будет выглядеть следующим образом:

app.controller("AuthCtrl", ["$scope", "$rootScope", "Auth", function($scope, $rootScope, Auth) {

, а затем

$scope.createUser = function(username, email, password) { $rootScope.usernames = username $scope.message = null; $scope.error = null;

Answer 2

При переходе к виду пользователя угловому создает новый экземпляр контроллера AuthCtrl, что означает новые возможности, поэтому есть нет Valu там.

Использовать службы для обмена данными (или даже масштабами) между контроллерами.

Answer 3

Когда ваше приложение изменяет маршруты, оно разрушает область действия старого контроллера и создает новую область. Это происходит, даже если вы используете тот же контроллер как для старого, так и для нового маршрута.

Храните постоянные данные в своей фабрике Auth вместе с функциями, которые создают эти данные.

app.factory("Auth", ["$firebaseAuth", 
    function($firebaseAuth) { 
    var AuthObj = {}; 
    //Store persistent data on AuthObj 
    AuthObj.ref = new Firebase("https://uniquecoders.firebaseio.com/"); 
    AuthObj.createUser = function(email,password) { 
     AuthObj.ref.createUser(
      {email: email, password: password }, 
      function(error, userData) { 
       if (error) { 
        //process error 
       } else { 
        //store data on AuthObj 
        AuthObj.userData = userData; 
       } 
      } 
     ); 
     return AuthObj.userData; 
    }; 
    //return AuthObj which holds functions and data 
    return AuthObj; 
    } 
]); 

Используйте контроллер вызывать эти функции и получить постоянные данные.

app.controller("AuthCtrl", ["$scope", "Auth", 
    function($scope, Auth) { 
    //retrieve userData 
    $scope.userData = Auth.userData; 
    $scope.createUser = function() { 
      if ($scope.userData) { 
       return; 
      } else { 
       $scope.userData = 
        //invoke function in factory 
        Auth.createUser($scope.email,$scope.password); 
      }; 
    }; 
    } 
]); 

Таким образом, данные сохраняются и сохраняются при изменении маршрутов.