AngularJS - ng-change仅在页面加载时触发一次

时间:2018-03-28 15:50:10

标签: angularjs forms validation

我正在使用Angular 1.5编写应用程序。我有一个带时间输入的表格。

builder.environment().put("PYTHONUNBUFFERED","TRUE");

由于某种原因,ng-change功能仅在页面加载时调用一次,即使我输入新值也不会再次调用。我不确定我做错了什么。

这是我的JSFiddle:http://jsfiddle.net/aubz88/j25jwtL2/

2 个答案:

答案 0 :(得分:0)

由于失效,

ng-change 不是触发方法。检查此工作代码

<!DOCTYPE html>
 <html lang="en">

<head>
<meta charset="UTF-8" />
<title>Example - example-date-input-directive-production</title>
<script data-require="angular.js@1.3.15" data-semver="1.3.15" src="https://code.angularjs.org/1.3.15/angular.js"></script>
   </head>
   <body ng-app="dateInputExample">
    <script>

  angular.module('dateInputExample', [])
 .controller('DateController', ['$scope', function($scope) {
   $scope.changed = 0;
  $scope.example = {
    value: new Date(1999, 0, 1, 15, 30, 0)
  };



   $scope.change = function(){
     $scope.changed ++;
   }

 }])  
</script> 
<form name="myForm" ng-controller="DateController as dateCtrl">
  <label for="exampleInput">Picktime:</label> 
  <input type="time" time id="exampleInput" name="input" ng-model="example.value" placeholder="yyyy-MM-dd" required="" ng-change="change();" />
  <div role="alert">
    <span class="error" ng-show="myForm.input.$error.required">
     Required!</span>
    <span class="error" ng-show="myForm.input.$error.time">
     Not a valid date!</span> 
  </div>
  <tt>value = {{example.value | date: "HH:mm"}}</tt>

  <br />
  <div>The time has been changed 
            <ng-pluralize count="changed" when="{'0': '{} times.',
                 'one': '1 time.',
                 'other': '{} times.'}"></ng-pluralize>
  </div>
</form>
<!--<form name="myForm" ng-controller="DateController as accvm">-->
<!--  <div class="item item-input" ng-class="{ 'has-error' : accvm.addForm.time.$invalid }">-->
<!--            <span class="input-label" ng-i18next="TIME"></span>-->
<!--            <input name="time" type="time"   ng-model="accvm.data.time" ng-change="accvm.timeChange()" style="text-align: right" required />-->
<!--        </div>-->
<!--        <div ng-messages="accvm.addForm.time.$error">-->
<!--            <div class="form-error" ng-message="required"><span ng-i18next="VALIDATION_PROJECT"></span></div>-->
<!--             <div class="form-error" ng-message="max"><span ng-i18next="VALIDATION_TIME_FUTURE"></span></div>-->
<!--        </div>-->
<!--        {{changed}} {{accvm.addForm.time.$invalid}}-->
<!--</form>-->

答案 1 :(得分:0)

我认为问题在于您在控制器和模板中使用的缩写词不同,更改accvm vm它对我来说正常工作。

此处您的JSFiddle已更新:http://jsfiddle.net/j25jwtL2/58/