2017-09-28 3 views
0

Je reçois une erreur "échec d'instanciation du module" lorsque j'essaie d'injecter et d'utiliser un service Angular que j'ai écrit. J'ai une page HTML qui appelle une API. Je dois pouvoir prendre la valeur de retour de l'API et la stocker pour l'utiliser dans un autre contrôleur.

Voici la page HTML:

<!doctype html> 
 
<html ng-app="auth"> 
 
<head> 
 
    <title>Login AngularJS</title> 
 
</head> 
 
<body> 
 
    <div ng-app="auth" ng-controller="Login"> 
 
     <form method="post" ng-submit="login()" novalidate ng-controller="Login"> 
 
      DBID<input type="text" name="dbId" value="23" ng-model="dbId" /> UserName 
 
      <input type="text" name="username" value="[email protected]" ng-model="username" /> Password 
 
      <input type="text" name="password" value="test1234" ng-model="password" /> 
 
      <input type="submit" id="submit" value="login" /> 
 
      <p>The Token is: {{token}}</p> 
 
     </form> 
 
     <script src="Scripts/angular.js"></script> 
 
     <script src="Scripts/app/sharedProperties.js"></script> 
 
     <script src="Scripts/app/login.js"></script> 
 
    </div> 
 
</body> 
 
</html>

Voici le contrôleur:

var auth = angular.module('auth', ['SharedProperties']); 
 

 
auth.controller('Login', function ($scope, $http, SharedProperties) 
 
{ 
 
    $scope.list = []; 
 

 
    $scope.login = function() 
 
    { 
 
     if ($scope.dbId) { 
 

 
      $scope.list.push(this.dbId); 
 
      $scope.text = ''; 
 

 
      var Credentials = new Object(); 
 
      Credentials.DBID = this.dbId; 
 
      Credentials.username = this.username; 
 
      Credentials.password = this.password; 
 

 
      $http({ 
 
       dataType: 'json', 
 
       method: 'POST', 
 
       url: 'http://localhost:55049/api/Security/Login', 
 
       data: Credentials, 
 
       headers: { 
 
        'Content-Type': 'application/json', 
 
        'Authorization': 'Basic VGVzdEFwcGxpY2F0aW9uVG9rZW46' 
 
       } 
 
      }).then(function (response) 
 
      { 
 
       $scope.token = response.data; 
 
      }); 
 

 
     } else 
 
     { 
 
      alert("Please add DBID"); 
 
     } 
 
    }; 
 
});

Et voici mon code de service:

var auth = angular.module('auth', []); 
 

 
auth.service('SharedProperties', function() 
 
{ 
 
    var property = ''; 
 

 
    return { 
 
     getProperty: function() 
 
     { 
 
      return property; 
 
     }, 
 
     setProperty: function (value) 
 
     { 
 
      property = value; 
 
     } 
 
    }; 
 
});

Répondre

0

Si vous voulez utiliser le module séparé pour vos propriétés partagées, vous devez initialiser ce module. Remplacer

var auth = angular.module('auth', []); 

avec

var auth = angular.module('SharedProperties', []); 

dans votre code de service.

+0

Cela a résolu le problème mais malheureusement, lorsque je récupère la valeur dans l'autre contrôleur (après l'avoir configuré dans le premier contrôleur), la valeur est une chaîne vide. Merci de votre aide! – CrystalLake62

+0

Veuillez le marquer comme réponse acceptée alors. Ré. service de propriété, essayez d'utiliser self = this et self.property au lieu de simplement la variable de propriété. – SSH

+0

Merci. Je l'ai marqué comme accepté. – CrystalLake62