ui.bootstrap.datepicker是开放不是一个按钮工作

问题描述：

我想打开一个日期选择器，当我点击一个按钮。
这是我的看法：

I want open a datepicker when i click on a button. Here is my view :

<!doctype html>
<html ng-app="plunker">

<head>
  <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.js"></script>
  <script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.7.0.js"></script>
  <script src="script.js"></script>
  <link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" rel="stylesheet">
</head>

<body>   
  <div ng-controller="demo">    
    <input type="text" datepicker-popup="dd.MM.yyyy" ng-model="dt" is-open="opened" ng-required="true" />
    <button style="height:34px;" class="btn btn-default" ng-click="open()">
      <i class="icon-calendar"></i>
    </button>

  </div>
</body>

</html>

和我的控制器

var demo = angular.module('plunker', ['ui.bootstrap']);
demo.controller('demo', function($scope) {
  $scope.dt = new Date();
  $scope.open = function() {
    $scope.opened = true;
  };
});

一个plunker可以在这里找到： http://plnkr.co/edit/ AzASfL2t5DdIx1ayDOS5？p = preVIEW

A plunker can be found here : http://plnkr.co/edit/AzASfL2t5DdIx1ayDOS5?p=preview

我在做什么错了？
非常感谢你。

What i am doing wrong ? Thank you very much

答

分叉PLUNKER

FORKED PLUNKER

您在你的打开添加 NG-点击 $事件财产（）方法，做一个 $事件。preventDefault（）和 $ event.stopPropagation（）打开UI自举的日期选择器。

You have to add the ng-click $event property in your open() method and do an $event.preventDefault() and $event.stopPropagation() to open ui-bootstrap's datepicker.

的 JAVASCRIPT 的

var demo = angular.module('plunker', ['ui.bootstrap']);
demo.controller('demo', function($scope) {
  $scope.dt = new Date();
  $scope.open = function($event) {
    $event.preventDefault();
    $event.stopPropagation();
    $scope.opened = true;
  };
});

的 HTML 的

<button style="height:34px;" class="btn btn-default" ng-click="open($event)">
  <i class="icon-calendar"></i>
</button>

ui.bootstrap.datepicker是开放不是一个按钮工作

相关推荐