Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/angularjs/23.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Angularjs HTML5-事件触发器中的日期选择器打开和关闭_Angularjs_Angular Ui Bootstrap - Fatal编程技术网

Angularjs HTML5-事件触发器中的日期选择器打开和关闭

Angularjs HTML5-事件触发器中的日期选择器打开和关闭,angularjs,angular-ui-bootstrap,Angularjs,Angular Ui Bootstrap,我想单击图像图标打开html5的日历弹出窗口。我正在使用angularjs。ui引导TPL的版本问题。有人请尽快帮助我 <!doctype html> <html ng-app="ui.bootstrap.demo"> <head> <script src="https://code.angularjs.org/1.4.7/angular.min.js"></script> <script src="https

我想单击图像图标打开html5的日历弹出窗口。我正在使用angularjs。ui引导TPL的版本问题。有人请尽快帮助我

<!doctype html>
<html ng-app="ui.bootstrap.demo">
  <head>
    <script src="https://code.angularjs.org/1.4.7/angular.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/1.2.5/ui-bootstrap-tpls.js"></script>
    <script>
    angular.module('ui.bootstrap.demo', ['ui.bootstrap']);
    angular.module('ui.bootstrap.demo').controller('DatepickerDemoCtrl', function ($scope) {
       $scope.open = function($event) {
        $event.preventDefault();
        $event.stopPropagation();

        $scope.opened = true;
        console.log($scope.dt);
      };

    });
    </script>
    <link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
  </head>
  <body>

<div ng-controller="DatepickerDemoCtrl">
    <pre>Date output: <em>{{dt}}</em></pre>

    <div class="row">
        <div class="col-md-6">
            <p class="input-group">
              <input type="date" class="form-control" ng-model="dt" ng-required="true" />
              <input type="hidden" datepicker-popup="yyyy-MM-dd" ng-model="dt" is-open="opened" ng-required="true" close-text="Close" />
              <span class="input-group-btn">
                <button type="button" class="btn btn-default" ng-click="open($event)"><i class="glyphicon glyphicon-calendar"></i></button>
              </span>
            </p>
        </div>
    </div>
</div>
  </body>
</html>

angular.module('ui.bootstrap.demo',['ui.bootstrap']);
angular.module('ui.bootstrap.demo').controller('DatepickerDemoCtrl',function($scope){
$scope.open=函数($event){
$event.preventDefault();
$event.stopPropagation();
$scope.opened=true;
log($scope.dt);
};
});
日期输出:{{dt}


我建议你试试这样的东西

Working fiddle :
文本
让我知道它是否有效。
您使用的angular Js、Datepicker和angular ui引导TPL的版本是什么?

我建议您尝试类似的方法

Working fiddle :
文本
让我知道它是否有效。
您使用的angular Js、Datepicker和angular ui引导TPL的版本是什么?

这里可能对您的情况有所帮助


在这里,它可能对您的情况有所帮助