Angular 2 Typescript 中的第三方库答案

【问题标题】：Third-party library in Angular 2 TypescriptAngular 2 Typescript 中的第三方库
【发布时间】：2016-02-01 15:14:17
【问题描述】：

我正在尝试在我的项目中使用 pickadate.js 库。

到目前为止我已经尝试过什么......

  ngAfterViewInit() {
    $('.datepicker').pickadate({
        format: 'mm/dd/yyyy',
        formatSubmit: 'mm/dd/yyyy',
        hiddenName: true
    });
  }

得到以下错误：

$(...).pickadate 不是函数

我真的不想为我的 index.html 中的任何内容编写 td.ts：

<!DOCTYPE html>
<html lang="de">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>My Angular2 App</title>
  <meta name="description" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <!-- inject:css -->
  <link rel="stylesheet" href="/node_modules/pickadate/lib/themes/default.css">
  <link rel="stylesheet" href="/node_modules/bootstrap/dist/css/bootstrap.min.css">
  <link rel="stylesheet" href="/app/assets/main.css">
  <!-- endinject -->
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.0/jquery.js"> </script>
    <!-- inject:js -->
  <script src="/node_modules/pickadate/lib/legacy.js"></script>
  <script src="/node_modules/pickadate/lib/picker.time.js"></script>
  <script src="/node_modules/pickadate/lib/picker.date.js"></script>
  <script src="/node_modules/pickadate/lib/picker.js"></script>
  <!-- endinject -->

</head>
<body>

...

【问题讨论】：

你在哪里添加了 jQuery 导入？模板中的脚本标签被删除。还有一些关于 Angular2 中的 datepicker 的问题。您是否检查过他们是否提供了您需要的信息？
您似乎没有添加“pickadate”库。

标签： javascript angular

【解决方案1】：

确保您已将 jQuery 的 TSD（右键单击，另存为...）包含到您的应用组件中：

/// <reference path="../path/to/jquery.d.ts" />

然后也下载这个typing 并导入：

/// <reference path="../path/to/pickadate.d.ts" />

最后，确保将 jQuery 和 PickADate 导入到您的 HTML 中。如果一切正常，您的代码应该可以工作。

【讨论】：

【解决方案2】：

您不能在组件模板中添加库脚本标签。 Angular2 模板中的<script> 标签被删除。

【讨论】：

好吧，问题是我没有在我的 jquery.js thx 之后调用选择器