2017-09-28 12 views
0

私が書いたAngularサービスを注入して使用しようとすると、「モジュールのインスタンス化に失敗しました」というエラーが表示されます。 APIを呼び出すHTMLページがあります。 APIからの戻り値を受け取り、別のコントローラーで使用できるように保管する必要があります。

ここでは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>

ここでは、コントローラです:

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"); 
 
     } 
 
    }; 
 
});

そして、ここでは私のサービスコードである:

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

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

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

答えて

0

あなたの共有プロパティのための別のモジュールを使用する場合は、そのモジュールを初期化する必要があります。あなたのサービスコードで

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

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

交換してください。

+0

問題を修正しましたが、残念ながら他のコントローラの値を最初のコントローラに設定した後に値を取得すると、その値は空の文字列になります。ご協力ありがとうございました! – CrystalLake62

+0

それを受け入れられた答えとしてマークしてください。 Re。プロパティサービスの代わりに、self = thisとself.propertyを使用してみてください。 – SSH

+0

ありがとうございます。私はそれを受け入れたものとしてマークした。 – CrystalLake62

関連する問題