javascript - 如何将 Bootstrap 日期选择器添加为 Ember 组件

标签 javascript twitter-bootstrap ember.js

我最困难的事情之一就是获取现有的库并将它们添加到我的 Ember 项目中。我目前正在尝试添加 Bootstrap Date Picker作为 Ember 组件,但我无法让它正常运行。

我已将 Bootstrap JS 文件添加到我的 Vendor 文件夹,并将以下内容添加到 ember-cli-build:

app.import('vendor/datepicker/bootstrap-datepicker.min.js');

然后我创建了一个名为 date_picker 的组件 pod。该组件的模板如下:

<div class="input-group date" data-provide="datepicker" data-date-format="dd/mm/yyyy">
    <input type="text" class="form-control">
    <div class="input-group-addon">
        <span class="glyphicon glyphicon-th"></span>
    </div>
</div>

该组件的 JS 文件当前为:

import Component from '@ember/component';

export default Component.extend({

addDate(){
  $('.datepicker').datepicker({
    format: 'dd/mm/yyyy',
    startDate: '-3d',
    autoclose: true
});
}
});

在主模板中使用 {{date-picker}} 调用该组件。上面确实在屏幕上呈现了一个日期选择器,但行为不正确。例如,它不会自动关闭,虽然格式正确,但它不会循环几个月或总是在单击按钮时选择正确的日期。

在将其集成到 Ember 项目中时,我是否遗漏了一个步骤?

最佳答案

您是否考虑过使用现有的插件来实现此目的? https://github.com/soulim/ember-cli-bootstrap-datepicker

关于javascript - 如何将 Bootstrap 日期选择器添加为 Ember 组件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48783874/

相关文章:

css - Bootstrap : How to create additional menu items in navbar-collapse

javascript - 代码 $ ('body' ).on ('hidden.bs.modal' , '.modal' , function (){....} 做什么,什么时候被调用?

javascript - 将 2D 数组的 2D 网格展平为单个 2D 数组,在 JavaScript 中(功能上?)

javascript - 如何在不执行 JS 文件的情况下执行 Jquery.get?

javascript - 保护 JS 客户端 SDK

java - 将二进制数据添加到html表单中进行上传

css - 如何在 Bootstrap 3 中调整输入/提交框的大小

javascript - Ember JS : how to use the {{#each}} helper to render only loaded children?

node.js - 了解哪些依赖键导致了计算属性的更改

ember.js - 链接到 Action 参数在ember js中不起作用