Question

我正在尝试在我的项目中使用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>

...

Answer 1

您无法在组件模板中添加库脚本标记。 Angular2模板中的<script>标记将被删除。

Answer 2

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

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

然后还下载此typing并导入为：

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

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

Angular 2打字稿中的第三方图书馆

2 个答案: