文章/答案/技术大牛

发布

社区首页 >问答首页 >不使用angularJs的角数据采集器

问不使用angularJs的角数据采集器
EN

Stack Overflow用户

提问于 2017-01-23 08:00:25

回答 1查看 2.4K关注 0票数 1

我一直在尝试在我的一个应用程序中使用角形数据采集器。我正在遵循这一链接：

https://github.com/fragaria/angular-daterangepicker

安装了模块。
在控制器中写入依赖项。
使用脚本标记在..html/..ejs文件中添加依赖项。

<script src="jquery/dist/jquery.min.js"></script>
<script src="jquery-ui/jquery-ui.js"></script>
<script src="angular/angular.min.js"></script> 
<script src="moment/moment.js"></script>
<script src="angular-daterangepicker/bootstrap-   daterangepicker/daterangepicker.js"></script>
<script src="angular-daterangepicker/js/angular-daterangepicker.js"></script>
<link rel="stylesheet" href="angular-daterangepicker/bootstrap-dist/css/bootstrap.css"/>
<link rel="stylesheet" href="angular-daterangepicker/bootstrap-daterangepicker/daterangepicker.css"/>

$scope.datePicker.date = {startDate: null, endDate: null}; //in controller if i use this i get error (2)
<input date-range-picker class="form-control date-picker" type="text" ng-model="datePicker.date" />

错误：

1) TypeError: el.daterangepicker不是一个函数 2) TypeError:无法设置未定义的属性“日期”

如何消除这个错误？

jquery

angularjs

bootstrap-daterangepicker

angular-daterangepicker

回答 1

Stack Overflow用户

回答已采纳

发布于 2017-01-23 08:48:22

-这是工作示例-U需要从 https://github.com/fragaria/angular-daterangepicker下载并包含“ang-daterangepicker.min.js”文件。

<head>
    <meta charset="utf-8">
    <title>Daterange picker example</title>

    <!-- bower:css -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-daterangepicker/2.1.13/daterangepicker.min.css" />
    <!-- endbower -->

</head>

<body>
    <!-- bower:js -->
    <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.20/angular.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.20/angular-messages.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.10.6/moment.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-daterangepicker/2.1.13/daterangepicker.min.js"></script>
    <!-- endbower -->

    <script src="angular-daterangepicker-master/js/angular-daterangepicker.min.js"></script>

<div class="container">
    <h1>Daterange picker example</h1>

    <div class="row">
        <div class="col-md-6" ng-controller="TestCtrl">
            <form name="dateForm" class="form-horizontal">
                <div class="form-group">
                    <label for="daterange1" class="control-label">Simple picker</label>
                    <input date-range-picker id="daterange1" name="daterange1" class="form-control date-picker" type="text"
                           ng-model="date" required/>
                </div>
      </form>

            <div class="row">
                <h4>Model:</h4>
                <div class="col-md-12 well">
                    <label>Date range:</label><br>
                    {{date | json}}<br>
                    <label>Single date:</label><br>
                    {{singleDate | json}}<br>
                </div>
            </div>
        </div>
    </div>
</div>
</body>


<script>
exampleApp = angular.module('example', ['ngMessages', 'daterangepicker']);
exampleApp.controller('TestCtrl', function($scope) {
    $scope.date = {
        startDate: null,
        endDate: null
    };


});

angular.bootstrap(document, ['example']);</script>

</html>

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/41801563

复制

相似问题

问不使用angularJs的角数据采集器
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问不使用angularJs的角数据采集器EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问不使用angularJs的角数据采集器
EN