1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Document</title>
  6.     <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.css">
  7.     <link rel="stylesheet" href="node_modules/angular-bootstrap-datetimepicker/src/css/datetimepicker.css"/>
  8. </head>
  9. <body ng-app="MyApp">
  10. <p>{{mode}}</p>
  11.     <datetimepicker data-ng-model="mode"></datetimepicker>
  12. </body>
  13.     <script type="text/javascript" src="node_modules/moment/moment.js"></script>
  14.     <script type="text/javascript" src="node_modules/angular/angular.js"></script>
  15.     <script type="text/javascript" src="node_modules/angular-bootstrap-datetimepicker/src/js/datetimepicker.js"></script>
  16.     <script type="text/javascript" src="node_modules/angular-bootstrap-datetimepicker/src/js/datetimepicker.templates.js"></script>
  17.     <script type="text/javascript" src="locales/bootstrap-datetimepicker.zh-CN.js"></script>
  18.     <script>
  19.     var myAppModule = angular.module('MyApp', ['ui.bootstrap.datetimepicker'])
  20.     </script>
  21. </html>
  1. package.json
  1. {
  2.   "name": "cynthia",
  3.   "version": "1.0.0",
  4.   "description": "",
  5.   "main": "index.js",
  6.   "scripts": {
  7.     "test": "echo \"Error: no test specified\" && exit 1"
  8.   },
  9.   "author": "",
  10.   "license": "ISC",
  11.   "dependencies": {
  12.     "angular-bootstrap-datetimepicker": "^1.1.4",
  13.     "bootstrap": "^3.3.7"
  14.   }
  15. }

把以上两个文件放到同一目录

  1. npm install

运行index.html文件就可以看到效果了。

如果出现 ： TypeError: Cannot set property '$render' of undefined

说明angular的版本太低，这个版本要求至少在v1.2.30以上.

github传送门：https://github.com/raomojiuran/angular-bootstrap-datetimepicker

angular bootstrap timepicker TypeError: Cannot set property '$render' of undefined的更多相关文章

  1. bootstrap timepicker 在angular中取值赋值 并转化为时间戳

    上一篇我们讲到angular对于timepicker的一个封装后的插件angular-bootstrap-timepicker,但是由于angular的版本必须是v1.2.30以上的.对于有些涉及到多 ...

  2. 使用angular.bootstrap() 完成模块的手动加载

    之前我们看到使用ng-app指令,可以实现模块的自动加载.现在我们看下,angular中如何手动加载模块.需要使用到angular.bootstrap这个函数. <html> <he ...

  3. AngularJs angular.bind、angular.bootstrap、angular.copy

    angular.bind 返回一个调用self的函数fn(self代表fn里的this).可以给fn提供参数args(*).这个功能也被称为局部操作,以区别功能. 格式:angular.bind(se ...

  4. springMVC+angular+bootstrap+mysql的简易购物网站搭建

    springMVC+angular+bootstrap+mysql的简易购物网站搭建 介绍 前端的css框架用了bootstrap, 以及bootstrap的JS组件, 以及很好用的angular(a ...

  5. Angular - - angular.bind、angular.bootstrap、angular.copy

    angular.bind 返回一个调用self的函数fn(self代表fn里的this).可以给fn提供参数args(*).这个功能也被称为局部操作,以区别功能. 格式:angular.bind(se ...

  6. angular.extend、angular.$watch、angular.bootstrap

    1.angular.extend:依次将第二个参数及后续的参数的第一层属性(不管是简单属性还是对象)拷贝给第一个参数的第一层属性,即如果是对象,则是引用的是同一个对象,并返回第一个参数对象. 直接上代 ...

  7. Phonegap集成angular/bootstrap/animate.css教程

    1,phonegap集成angular 按照这篇文档的步骤:http://projectpoppycock.com/angularjs-phonegap-and-angular-seed-lets-g ...

  8. [Vue warn]: Error in render: "TypeError: Cannot read property '0' of undefined、vuejs路由使用的问题Error in render function

    1.[Vue warn]: Error in render: "TypeError: Cannot read property '0' of undefined 注意,只要出现Error i ...

  9. 《疯狂前端开发讲义jQuery+Angular+Bootstrap前端开发实践》学习笔记

    <疯狂前端开发讲义jQuery+Angular+Bootstrap前端开发实践>学习笔记 二〇一九年二月十三日星期三2时28分54秒 前提:本书适合有初步HTML.CSS.JavaScri ...

随机推荐

  1. 为什么使用 Spring Boot?

    Spring 是一个非常流行的基于Java语言的开发框架,此框架用来构建web和企业应用程序.与许多其他仅关注一个领域的框架不同,Spring框架提供了广泛的功能,通过其组合项目满足现代业务需求. S ...

  2. 使用MagicOnion实现gRPC

    1.什么是gRPC 官方文档:https://grpc.io/docs/guides/index.html 2.什么是MagicOnion MagicOnion开源地址:https://github. ...

  3. [Postman]调试和日志(10)

    Postman应用程序在我们发布之前会经过广泛的测试和beta版本.也就是说,可能存在应用程序崩溃或出现意外行为的情况.如果您无法   自行解决问题,可以在GitHub跟踪器中提出问题,或者 如果您希 ...

  4. OAuth2简易实战（四）-Github社交联合登录

    1. OAuth2简易实战(四)-Github社交联合登录 1.1. 用到的第三方插件 https://github.com/spring-projects/spring-social-github ...

  5. Debian/Ubuntu清理硬盘空间的8个技巧

    1. 删除残余的配置文件 通常Debian/Ubuntu删除软件包可以用两条命令 sudo apt-get remove <package-name> sudo apt-get purge ...

  6. Scala - 快速学习08 - 函数式编程：高阶函数

    函数式编程的崛起 函数式编程中的“值不可变性”避免了对公共的可变状态进行同步访问控制的复杂问题,能够较好满足分布式并行编程的需求,适应大数据时代的到来. 函数是第一等公民 可以作为实参传递给另外一个函 ...

  7. Python You-Get (送你一个免广告的视频和音乐网站 VIP)

    You-get可以在仅仅提供URL情况下就可以实现下载视频.图片.音乐等信息.也可以通过播放器在线观看视频或听音乐,重要的是再也不用烦恼弹出的广告了,如果你想观看视频,但又不想观看广告,并且你还想把视 ...

  8. 微信小程序入门（四）

    16.WXSS特性之模板及引用 模板引用 index.wxml <template name="tempItem"> <view> <view> ...

  9. Redis（4）---主从复制

    Redis主从复制 一.环境搭建      既然是主从复制,那肯定需要多个redis服务器,下面我先创建3个服务器,™的端口号分别是:6379.6380.6381.   1.复制默认配置文件redis ...

  10. 解决 .NET Core 在 Linux 下的时区问题

    环境 # dotnet --info .NET Core SDK (reflecting any global.json): Version: Commit: 8a7ff6789d Runtime E ...