Question

我想像这些开发一个angularui。当我点击提交按钮时，我想要一个由一个人开发的一个安静的网络服务。我的用户名和密码已经在restful webservice中受到了诟病。当我请求restful webservice时，它将验证我的用户名和密码。如果成功，它将显示我的数据。如果不成功，将显示登录失败信息。

案例1：在那个html文件中，我硬编码了我的用户名和密码。在这种情况下，我能够向restful webservice发送请求，我无法从他的机器获得响应

案例2：我的问题是我将我的值绑定到url。我在这里发送我的代码。谁能帮我。如何将我的值绑定到url以及如何处理响应。

用户名：一个文本框密码：一个文本框提交按钮

我的代码：

<!DOCTYPE html>
<html>
<body>
<form  method="get" ng-submit="submit()">
<div ng-app="formmodule" ng-controller="submitController">
Name :<input type="text" ng-model="uname"></br>
pwd:<input type="password" ng-model="pwd"><br>
<br>


<button ng-click="submit()">submit</button>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>
</form>

<script>

var app=angular.module("formmodule",[]);


app.controller("submitController",function submit($scope,$http){
    var uname = $scope.uname;
    var pwd=  $scope.pwd;

     var url = 'http://9.000.000.000:2020/restDemo/rest/user/users?uname=abc&pwd=abc';
            $http.get(url).success(
                function(data)
            {

                         $scope.output = data;

            });



});
</script>
</body>
</html>

Answer 1

我发现ng-submit超出ng-app的问题，请尝试将ng-app置于<body>或<html>标记：

    <!DOCTYPE html>
    <html ng-app="formmodule">
    <body>
       <form  method="get" ng-submit="submit()">
          <div ng-controller="submitController">
              Name :<input type="text" ng-model="uname"></br>
              pwd:<input type="password" ng-model="pwd"><br>
              <br>
              <button ng-click="submit()">submit</button>
         </div>
      <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>
      </form>
      .......
     </body>
     </html>

Answer 2

除了Jai关于你的ng-app出错的地方，你应该对HTML和JS进行一些编辑。对于HTML，您应该执行类似

的操作

<form  method="get" ng-submit="submit(uname, pwd)">

在这里，您只需将ng-models传递给submit（）函数即可。从那里，它只是将值插入您的查询字符串。

function submit(username, password) {
  var root = 'http://9.000.000.000:2020/restDemo/rest/user/users';
  var queryString = '?uname=' + username + '&pwd=' + password;
  var url = root + queryString;
  ...
}

将范围变量分配给控制器中的局部变量时

var uname = $scope.uname;
var pwd=  $scope.pwd;

由于您可以在控制器中的任何位置访问范围变量，因此您并没有做太多事情。上面提交的函数也可以写成：

function submit() {
  var root = 'http://9.000.000.000:2020/restDemo/rest/user/users';
  var queryString = '?uname=' + $scope.uname+ '&pwd=' + $scope.pwd;
  var url = root + queryString;
  ...
}

您不会将任何内容传递到提交功能。

Angularjs宁静的webservice调用

2 个答案: