我是 Angular 2+ 的新手。我正在尝试将 Bootstrap 3 Datepicker 集成到 AngularJS2。我使用了【解决方案】:How to use Bootstrap 3 Datepicker in angular 2 。但出现错误,例如
找不到名称“$”
有什么方法可以使用或不使用jquery来实现该任务吗?
下面给出了我的代码。
index.html
<script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
<script
src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"
integrity="sha256-T0Vest3yCU7pafRw9r+settMBX6JkKN06dqBnpQ8d30="
crossorigin="anonymous"></script>
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"> </script>
new-job.component.html
<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
<input type='text' class="form-control" id='proposed_start_at' formControlName="proposed_start_at" #proposed_start_at/>
<label class="mdl-textfield__label" for="proposed_start_at">Start Time</label>
</div>
new-job.component.ts
@ViewChild("proposed_start_at")
public startDateElementRef: ElementRef;
ngAfterViewInit() {
$(this.startDateElementRef.nativeElement).datetimepicker({format: 'LT'});
}
我想实现[链接]中给出的日期时间选择器:https://eonasdan.github.io/bootstrap-datetimepicker/
最佳答案
您需要添加:declare var $:any;
declare var $: any;
@Component({
...
})
确保您的库中包含所有必需的库:
npm install jquery bootstrap moment eonasdan-bootstrap-datetimepicker--save
然后在 angular-cli.json
"styles": ["../node_modules/eonasdan-bootstrap-datetimepicker/build/css/bootstrap-datetimepicker.min.css"],
"scripts": [
"../node_modules/jquery/dist/jquery.js",
"../node_modules/bootstrap/dist/js/bootstrap.js",
"../node_modules/moment/moment.js",
"../node_modules/eonasdan-bootstrap-datetimepicker/src/js/bootstrap-datetimepicker.js",
...
并且您不需要将这些添加到index.html 的脚本标记中
关于jquery - Angular 2+ 中的 Bootstrap 3 Datepicker(带或不带 jquery),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46068735/