pickadate.js 根本不工作答案

【问题标题】：pickadate.js not working at allpickadate.js 根本不工作
【发布时间】：2016-10-29 18:13:03
【问题描述】：

试图学习如何使用这个插件，但我似乎无法让任何东西工作。有人可以指出我正确的方向吗？这是一个 laravel 项目，但这应该没什么区别。

这是我的html：

<p><input id="date" class="form-control" ng-model="currentWimDate" placeholder="Date..." type="text"></p>

还有我的 index.blade.php：

<html lang="en" ng-app="wim">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>WIM(afy)</title>

    <link href="bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="css/wimmain.css" rel="stylesheet">
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
    <link rel="stylesheet" href="bower_components/pickadate/lib/themes/default.css" id="theme_base">
    <link rel="stylesheet" href="bower_components/pickadate/lib/themes/default.date.css" id="theme_date">
    <link rel="stylesheet" href="bower_components/pickadate/lib/themes/default.time.css" id="theme_time">

    <script src="bower_components/angular/angular.min.js"></script>
    <script src="bower_components/ng-file-upload-shim/ng-file-upload-shim.min.js"></script>
    <script src="bower_components/ng-file-upload/ng-file-upload.min.js"></script>
    <script src="bower_components/lodash/lodash.js"></script>
    <script src="bower_components/angular-route/angular-route.min.js"></script>
    <script src="bower_components/angular-local-storage/dist/angular-local-storage.min.js"></script>
    <script src="bower_components/restangular/dist/restangular.min.js"></script>

    <script src = "js/app.js"></script>
    <script src = "js/services.js"></script>
    <script src = "js/controllers.js"></script>
    <script src = "js/checkPass.js"></script>
    <script src = "js/signupValidation.js"></script>
    <script src = "js/dropdown.js"></script>
    <script src = "js/profileActions.js"></script>

    <style>

        li {
            padding-bottom: 8px;
        }

    </style>
</head>

<body style="background-color: #ef5350;">       
    <div ng-view></div>


    <script src="bower_components/jquery/dist/jquery.min.js"></script>
    <script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
    <script src="bower_components/pickadate/lib/picker.js"></script>
    <script src="bower_components/pickadate/lib/picker.date.js"></script>
    <script src="bower_components/pickadate/lib/picker.time.js"></script>

    <script type="text/javascript">
    // PICKADATE FORMATTING
    $('#date').pickadate({
        format: 'mmmm d, yyyy',     // Friendly format displayed to user
        formatSubmit: 'mm/dd/yyyy', // Actual format used by application
        hiddenName: true            // Allows two different formats
    });
    </script>
</body>

我在这里做错了什么？

【问题讨论】：

标签： javascript jquery laravel datepicker pickadate

【解决方案1】：

我认为您的 jQuery 代码在 Angular 完成将 #date 放入您的 HTML 之前运行。因此 jQuery 找不到您要查找的元素，所以什么也没有发生。您可以通过输出$('#date') 的结果来测试这一点。尝试在 Angular 完成渲染后运行 pickadate 代码。这是一个question，可能会对您有所帮助。

【讨论】：