当ng-model填满时,自动点击火力功能

时间:2017-08-28 15:01:30

标签: angularjs-ng-click angularjs-ng-model

我想在完成输入ng-model时自动触发我的功能。 我应用了2种不同的技术但没有任何效果 1. Approch

    <div class="col-sm-6">
    <input type="text" class="form-control" ng-model="testing" placeholder="Name" maxlength="50" /></div>
    <span ng-if="testing.length != null " ng-show="Add()"></span>
  1. 方法

    <div class="col-sm-6">
    <input type="text" class="form-control" ng-model="testing" placeholder="Name" maxlength="50" /></div>
    <span ng-show="testing && Add()"></span>
    
  2. 两个都用单个字符激活我的功能。我想在输入完成时触发Add()函数。我不想使用按钮。

1 个答案:

答案 0 :(得分:0)

尝试以下2个示例代码。

我希望以下示例代码可以帮助您解决您面临的问题

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

app.controller('myCtrl', function($scope) {
  $scope.testing = "";
  
  $scope.Add = function() {
    console.log("Hope this Helps!!")
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.5/angular.min.js"></script>

<div ng-app="app" ng-controller="myCtrl">
  <div class="col-sm-6">
    <input type="text" class="form-control" ng-model="testing" placeholder="Name" maxlength="50" />
  </div>
  <span ng-if="testing.length >=1 " ng-show="Add()"></span>
 <div>

或者你可以这样做

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

app.controller('myCtrl', function($scope) {
  $scope.testing = ""; //model scope variable initialization
  
  $scope.testFun=function(a){ //function to check whether length of variable is greater than 0
  if (a>=1) return true;
  else return false;
  }
  
  $scope.Add = function() { //function to be exucuted when ng-if gets true value
    console.log("Hope this Helps!!")
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.5/angular.min.js"></script>

<div ng-app="app" ng-controller="myCtrl">
  <div class="col-sm-6">
    <input type="text" class="form-control" ng-model="testing" placeholder="Name" maxlength="50" />
  </div>
  <span ng-if="testFun(testing.length)" ng-show="Add()"></span>
 <div>