[英]how to call any function in input type text in angularjs?
I have given 2 input text for time selection(FROM and TO) and one button to submit. 我给了2个用于时间选择的输入文本(FROM和TO)和一个提交按钮。 Initially my button is disabled that means whenever user edit on time FROM and TO my button get enabled. 最初,我的按钮是禁用的,这意味着每当用户按时从FROM和TO进行编辑时,都会启用我的按钮。 My function name is enable().Below is my code in which I have shown FROM to TO only. 我的函数名称是enable()。下面是我的代码,其中仅显示了FROM到TO。 I need to call enable() on input or md-input-container. 我需要在输入或md-input-container上调用enable()。
<md-content class=" pad-hori-27 margin-left66" ng-if="!contactDetails.isAllTime">
<div>
<md-input-container>
<label>From Time</label>
<input mdc-datetime-picker="" date="false" time="true" type="text" id="time2" placeholder="Time" min-date="minDate" format="HH:mm a" ng-model="contactDetails.timePeriod.fromTime" class=" md-input">
</md-input-container>
<md-input-container>
<label>To Time</label>
<input mdc-datetime-picker="" date="false" time="true" type="text" id="time2" placeholder="Time" min-date="minDate" format="HH:mm a" ng-model="contactDetails.timePeriod.toTime" class=" md-input">
</md-input-container>
</div>
</md-content>
You need ng-change
attribute for this 您需要为此的ng-change
属性
<input mdc-datetime-picker="" md-select="enable()" date="false" time="true" type="text" id="time2" placeholder="Time" min-date="minDate" format="HH:mm a" ng-model="contactDetails.timePeriod.fromTime" class=" md-input">
you can create a watch on collection like this: 您可以像这样在集合上创建手表:
$scope.$watch('contactDetails.timePeriod.fromTime', function(newValues, oldValues){
if(newValues != oldValues) {
$scope.enable();
}
});
you can call function with the help of ng-change or ng-click directive 您可以借助ng-change或ng-click指令调用函数
like as 像
<input mdc-datetime-picker="" ng-change="enable()" date="false" time="true" type="text" id="time2" placeholder="Time" min-date="minDate" format="HH:mm a" ng-model="contactDetails.timePeriod.fromTime" class=" md-input">
but In place of call function to enable button you can you angular js form validation https://docs.angularjs.org/guide/forms 但是您可以使用js表单验证https://docs.angularjs.org/guide/forms来代替启用按钮的调用功能
I am not sure you need to call enable at each change the input. 我不确定每次更改输入时都需要调用enable。 Instead, use ng-disabled on your button, providing a function testing that FROM and/or TO are filled. 相反,请在按钮上使用ng-disabled ,提供一项功能来测试FROM和/或TO是否已填充。
If you really need to call enable on change, use ng-change . 如果您确实需要在更改时调用enable,请使用ng-change 。
EDIT (to detail the solution) For what it's worth, here is what I suggested. 编辑 (以详细说明解决方案)对于它的价值,这是我建议的。
angular.module('changeExample', []) .controller('ExampleController', ['$scope', function($scope) { $scope.value = ''; $scope.disable = function() { return $scope.value === ''; }; }]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="changeExample"> <div ng-controller="ExampleController"> <input type="value" ng-model="value" id="ng-change-example1" /> <button ng-disabled="disable()">Submit</button> <p> Value is "{{value}}" (activated: {{!disable()}}) </p> </div> </div>
Note that this is a standard way to do it with Angular, instead of rely on $watch as suggested. 请注意,这是使用Angular的标准方法,而不是像建议的那样依赖$ watch 。
Cheers 干杯
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.