ng-focus或ng-click在Angular中无法正常工作

Question

我有一个文本输入字段和一个日期选择器嵌入其中。 问题是当我们关注甚至单击输入字段时

日期选择器未显示。

但是，如果您在控制台中放置调试器并进行调试，则它会显示输入字段获得焦点或单击的时间。

   <div class="row">
                <input id="field" placeholder="Choose Date" class="span-12" ng-model="vm.date" ng-blur="vm.onSaveTime()" ng-focus="vm.showDatePicker()">
   </div>

这是代码

vm.showDatePicker = function(){
    debugger;
    var options = {
        format:"YYYY-MM-DD"
    };
    $('#field').datepicker(options);
}

日期选择器最初在页面加载时，如果您没有在控制台中进行调试或如果您没有单击面板中的其他字段然后在单击之后才显示。

为什么会这样呢？

Answer 1

可能对您有帮助

<div id="wrapper" ng-app="myApp">
<p>{{datePicker || "00/00/0000"}}</p>
<input type="text" ng-model="datePicker" datepicker />
</div>

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

myApp.directive("datepicker", function () {
return {
restrict: "A",
require: "ngModel",
link: function (scope, elem, attrs, ngModelCtrl) {
  var updateModel = function (dateText) {
    scope.$apply(function () {
      ngModelCtrl.$setViewValue(dateText);
    });
  };
  var options = {
    dateFormat: "dd/mm/yy",
    onSelect: function (dateText) {
      updateModel(dateText);
    }
  };
  elem.datepicker(options);
}
}
});

https://codepen.io/anon/pen/BWeWVp