Question

我无法弄清楚为什么我的比较功能和我的插入功能都不起作用。我相信它的一部分可能是因为该功能永远不会被按钮调用？我怎么能告诉你呢？警报看起来似乎不适用于角度代码。

这是我的loginHandler.js

(function() {
var app = angular.module('loginHandler', []);

app.controller('LoginController', ['$http' ,function($http){
  var database = this;
  this.validated = false;
  database.dbData = [];

      $http.get('/resources/DatabaseObject.json').success(function(data){
          database.dbData = data;
      });

  this.login = function(credentials){
      loggedInUser = credentals.username;
      validated = true;

      $http.get('/resources/DatabaseObject.json').success(function(data){
          $scope.dbData.push({"123":{"username":"meph","ip":"123","timeLastLogin":"123"}}, "session");
      });
  };

  this.checkSession = function(){
      var ip = "123456";

      if(session.ip.equals(123456)){
          return true;
      }
  };
 }]);
})();

这两个函数都没有工作....不是login或checkSession。

DatabaseObject.json

[{
"users": {
    "cra": {
        "firstName": "Jn",
        "lastName": "it",
        "username": "dmph",
        "email": "ran61@yahoo.com",
        "ip": "192.168.1.1",
        "password": "1234",
        "computerName": "os",
        "prviateKey": "1D3RW12390ASLEWRQ1235"
    },
    "mus": {
        "firstName": "James",
        "lastName": "mh",
        "username": "ch",
        "email": "j61@gmail.com",
        "ip": "192.168.1.1",
        "password": "11212",
        "computerName": "ops",
        "prviateKey": "1D3RW12390ASLEWRQ1235"
    }
},
"session": {
    "123456": {
        "username": "crh",
        "ip": "123456",
        "timeLastLogin": "123456787654"
    }
}
}]

这是我的HTML

   <html lang="en" ng-app="gemStore">

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">

<title>Basic Company Template for Bootstrap 3</title>

<!-- Bootstrap core CSS -->
<link href="css/bootstrap.css" rel="stylesheet">

<!-- Custom CSS for the 'One Page Wonder' Template -->
<link href="css/one-page-wonder.css" rel="stylesheet">

<script type="text/javascript" src="angular/angular.min.js"></script>

<script type="text/javascript" src="script/headerPanel.js"></script>
<script type="text/javascript" src="script/errorHandler.js"></script>
<script type="text/javascript" src="script/loginHandler.js"></script>
<script type="text/javascript" src="script/sessionHandler.js"></script>
</head>

<body ng-controller="NameController as name">
<div ng-controller="ErrorController as errorController">
<div ng-controller="LoginController as loginCtrl">
<nav class="navbar navbar-fixed-top navbar-inverse" role="navigation">
<div class="container" ng-controller="CredentialsController as credentials">
    <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="index.html">Home</a>
    </div>

    <!-- Collect the nav links, forms, and other content for toggling -->
    <div class="collapse navbar-collapse navbar-ex1-collapse">
        <ul class="nav navbar-nav">
            <li><a class="act" href="#about">About</a>
            </li>
            <li><a href="#services">Services</a>
            </li>
            <li><a href="#contact">Tutorial</a>
            </li>
            <li><a href="#features">Features</a>
            </li>
            <li><a href="download.html" onclick="">Download</a>
            </li>
        </ul>
        <form>
            <ul class="nas navbar-na">
                <li ng-hide="loginCtrl.checkSession(loginCtrl.dbData.session)"><a>User ID:  <input ng-model="credentials.username" type="text"></a></li>
                <li ng-hide="loginCtrl.checkSession(loginCtrl.dbData.session)"><a>Password:  <input ng-model="credentials.password" type="password" onkeyup="if (event.keyCode == 13) document.getElementById('loginBtn').click()"></a></li>
                <li style="color: red;" ng-show="loginCtrl.checkSession(loginCtrl.dbData.session)"><h2>LOGGED IN AS {{credentials.username}}</h2></li>
            </ul>
            <ul class="nav navbar-nav">
                <li><a ng-click="loginCtrl.login(credentials)" method="post" novalidate type="submit" href="index.html" id="loginBtn">Login</a></li>
            </ul>
        </form>
    </div>

    <!-- /.navbar-collapse -->
</div>
<div style="color: red;" ng-repeat="login in loginCtrl.dbData">
    <h1>{{login.session}}</h1>
</div>
</nav>
</div>
<div style="color: red;" ng-repeat="errorArray in errorController.errors">
    <h1>{{errorArray.error}}</h1>
</div>
</div>


<div class="header-image">

<div class="headline">
    <div class="container">
        <h1>{{name.name}}</h1>
        <h2>The Impossible!</h2>
    </div>
</div>

</div>
</body>
</html>

我不确定提交按钮是否正常....呸！对不起....我真的很擅长这个东西！我希望有人可以帮助我更好地理解它，我一直在努力尝试不同的事情。

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

Answer 1

push不起作用，因为您有database.dbData，但试图进入$scope.dbData（不存在）。

比较不起作用，因为您与session.ip（未在任何地方定义）进行比较。

Answer 2

我相信它是因为您使用this.代替$scope.

此外，您还没有将$scope传递给您的参数...

app.controller('LoginController', ['$http' ,function($http){

应该是：

app.controller('LoginController', ['$http, $scope' ,function($http, $scope){

在下面你应该使用:(不是this）

$scope.login = function () { /* ... */ };
$scope.checkSession = function () { /* ... */ };

比较和插入Angular JSon数据

2 个答案: