时间戳

首页 > 解决方案 > 参数未传递给 ng-submit 上的函数

javascript - 参数未传递给 ng-submit 上的函数

问题描述

我有一个函数 reset(username) 输出输入到输入字段中的任何内容ng-model="username"。为什么它没有出现在控制台中？

这是我的功能

$scope.reset = function (username) {
   console.log(username);
};

以及我提交表格的方式

<form name="Form" ng-controller="ResetController" ng-submit="reset(username)">
<div>
   <div class="row top5">        
      <label for="username">Username</label>
      <div class="col-xs-4">
         <input type="text" id="username"  placeholder="" maxlength="255"
          ng-model="username" required autofocus>
      </div>  

   <div>
      <div class="col-xs-5">          
         <button translate class="btn btn-secondary" type="submit">Reset</button>
      </div>
   </div>
</div>   
</form>

控制器按要求

app.controller("ResetController", function ($scope) {
   $scope.username='';
   $scope.reset = function (username) {
      console.log('username = ', username);
   };
});

标签： javascriptangularjs

解决方案

我相信您确实拥有 ng-app 和除此表单之外的所有其他内容，但是如果您将输入作为对象的属性而不是直接作为 $scope. 特性。在这里查看答案。并在代码中注意我如何将用户名附加到$scope.object.username

var app = angular.module('myApp',[])

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

   $scope.object = {};
   $scope.reset = function(username){
    console.log(username);
   };
   
}])
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp">
  <form name="Form" ng-controller="ResetController" ng-submit="reset(object.username)">
  <div>
     <div class="row top5">        
        <label for="username">Username</label>
        <div class="col-xs-4">
           <input type="text" id="username"  placeholder="" maxlength="255"
            ng-model="object.username" required autofocus>
        </div>  

     <div>
        <div class="col-xs-5">          
           <button translate class="btn btn-secondary" type="submit">Reset</button>
        </div>
     </div>
  </div>  
  </form>
</div>

推荐阅读