角度输入有效手动

我正在使用引导日期选择器。当我点击图标日期&时自动进入输入。但输入仍然无效，因为我没有直接与它进行交互。有任何一个人面临这个问题。角度输入有效手动

这里是该plnkr：http://plnkr.co/edit/yBmwZCCPvTOQWE6q3BW5

视图

<body data-ng-controller="ReservationController as resvnCtrl"> 
    <div class="container"> 
    <div class="col-lg-6 col-lg-offset-3 col-md-8 col-md-offset-2 col-sm-12 col-xs-12 "> 
     <div> 
      <h2 class="text-center page-heading">Make a reservation</h2> 
     </div> 
     <div> 
      <form role="form" name="resvnCtrl.form" data-ng-submit="resvnCtrl.submitForm(resvnCtrl.form.$valid)" novalidate> 
       <div class="form-group" data-ng-class="{'has-error':resvnCtrl.form.time.$invalid && (resvnCtrl.form.time.$dirty || resvnCtrl.form.$submitted) }"> 
        <label class="control-label">Date-Time</label> 
        <div class='input-group date' id='datetimepicker'> 
         <input type="text" name="time" id="time" data-ng-model="resvnCtrl.reservation.time" 
           placeholder="Enter Desired Time" class="form-control" required> 
         <span class="input-group-addon pointer" data-date-picker> 
          <i class="fa fa-calendar"></i> 
         </span> 
        </div> 
        <div data-ng-messages="resvnCtrl.form.time.$error" data-ng-if="resvnCtrl.form.time.$dirty || resvnCtrl.form.$submitted"> 
         <p class="help-block" data-ng-message="required">Date and Time required</p> 
        </div> 
       </div> 

       <div class="form-group"> 
        <div class="col-sm-4 col-sm-offset-2"> 
         <input type="submit" name="submit" id="submit" value="Make Reservation" class="btn btn-primary btn-block " > 
        </div> 
       </div> 
      </form> 
     </div> 
    </div> 
</div> 

</body>

控制器

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

angular.module('plunker') 
     .controller('ReservationController',ReservationController); 

    ReservationController.$inject=['$scope']; 
    function ReservationController($scope) { 

     var resvnCtrl=this; 
     resvnCtrl.reservation={}; 
     resvnCtrl.confirmation={}; 
     $('#datetimepicker').datetimepicker(); 

     resvnCtrl.submitForm=function(isValid){ 

       alert("valid:"+resvnCtrl.form.time.$valid); 
     } 
    }

来源

2015-11-05 Lokesh Cherukuri

我觉得你可以参考角带：http://mgcrea.github.io/angular-strap/#/datepickers。当您将angular-strap.min.js，angular-strap.tpl.min.js和libs.min.css导入到index.html时。你的app.js应该是这样的：

var app = angular.module('plunker', ['mgcrea.ngStrap.datepicker']);

来源

2015-11-05 07:35:47

这是在角度内使用jQuery的诅咒。初始化插件并且不触发摘要时，您的模型控制器仅更新$viewValue。摘要触发了我的另一个动作 - 重点进入或退出即运行摘要。

解决方案为这是观察者，将手动设置$modelValue由$setViewValue()方法，角度将知道发生了什么事，并更新验证。

而且请为datepicker创建单独的指令，它将在您使用指令的元素上初始化它。

来源

2015-11-05 08:07:20 Appeiron

我从来没有使用过这些$ modelValue，$ setViewValue（）。你可以发布一个例子或更新我的plunker –

角度输入有效手动

回答

相关问题