Fatal编程技术网
  • javascript/
  • Javascript AngularJs-日期时间选择器打开一次

Javascript AngularJs-日期时间选择器打开一次

javascript angularjs html

Javascript AngularJs-日期时间选择器打开一次,javascript,angularjs,html,Javascript,Angularjs,Html,我有一个带有引导的angularJs前端，我正在使用datetimepicker组件（）。它在第一次运行时效果良好，但在选择日期后，就无法再打开该组件 来源在 有人能帮我吗？非常感谢 代码如下 HTML: 当您可能希望dateStatus.open为true时，您似乎正在将dateStatus设置为true。尝试$scope.dateStatus.open=true；而不是$scope.dateStatus=true；在open函数中，当您可能希望dateStatus.open为true时，似乎

我有一个带有引导的angularJs前端，我正在使用datetimepicker组件（）。它在第一次运行时效果良好，但在选择日期后，就无法再打开该组件

来源在

有人能帮我吗？非常感谢

代码如下

HTML:

当您可能希望dateStatus.open为true时，您似乎正在将dateStatus设置为true。尝试$scope.dateStatus.open=true；而不是$scope.dateStatus=true；在open函数中，当您可能希望dateStatus.open为true时，似乎正在将dateStatus设置为true。尝试$scope.dateStatus.open=true；而不是$scope.dateStatus=true；在open函数中

我检查了$scope.dateStatus.open变量是否未被使用，并将其删除。但是问题仍然存在。如果你使用锚标记的ID而不是日期时间选择器配置的dropdownDate，我相信它会工作的。data datetimepicker config=“{dropdownSelector:'#dateNow'，MinuteSet:1}”我发现您使用的版本已经过时。你能试用一下最新的版本吗？没有已知的bug具有这种行为，因此可能与标记或javascript有关。我检查了$scope.dateStatus.open变量是否未被使用，并将其删除。但是问题仍然存在。如果你使用锚标记的ID而不是日期时间选择器配置的dropdownDate，我相信它会工作的。data datetimepicker config=“{dropdownSelector:'#dateNow'，MinuteSet:1}”我发现您使用的版本已经过时。你能试用一下最新的版本吗？没有已知的bug具有这种行为，因此可能与标记或javascript有关。如果您想让它变得简单，只需使用基本的HTML5日期选择器。如果你想让它变得简单，只需使用基本的HTML5日期选择器。 
    <!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" />
    <link rel="stylesheet" href="datetimepicker.css" />
    <script src="moment.js"></script>
    <script data-require="angular.js@1.3.x" src="https://code.angularjs.org/1.3.20/angular.js" data-semver="1.3.20"></script>
    <script data-require="jquery@1.11.0" data-semver="1.11.0" src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script data-require="angular-ui-bootstrap@0.11.2" data-semver="0.11.2" src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.11.2.min.js"></script>
    <script src="bootstrap.min.js"></script>
    <script src="datetimepicker.js"></script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="MainCtrl">

    <div class="form-group">

      <div class="dropdown">
        <a class="dropdown-toggle" id="dateNow" role="button" data-toggle="dropdown" data-target="#" href="#">
          <div class="input-group">
            <input type="text" class="form-control" 
              ng-model="model.date"
            >
            <span class="input-group-btn">
              <button type="button" id="dropdownDate" class="btn btn-default btn-xs">
                <i class="glyphicon glyphicon-calendar"></i></button>
            </span>
          </div>
        </a>
        <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
          <datetimepicker data-ng-model="model.date" data-datetimepicker-config="{ dropdownSelector: '#dropdownDate', minuteStep: 1 }"/>
        </ul>
      </div>


    </div>  
  </body>

</html>

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

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';

  $scope.model = {
    date: new Date()
  };

});