Question

我是角度2的初学者.Angular 2项目使用npm包，我们可以在角度2项目中使用它们，只需按如下方式导入

import { FormsModule } from '@angular/forms';

另外，我们可以使用package.json文件导入和安装npm包。

但问题是我必须在我的angular 2项目中导入bower组件。这是bower component的安装和使用指南的链接（https://www.predix-ui.com/?show=getting_started&type=local）

我将bower组件复制到项目的assets文件夹中，并尝试在index.html中导入该bower组件，如下所示

<head>
  <meta charset="utf-8">
  <title>TestApp</title>
  <base href="/">
  <link rel="import" href="./assets/px-spinner/px-spinner.html" />
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
</head>

然后我尝试在我的app.component.html文件中使用它们，如下所示。

src/app

然后它会出现以下错误。

<h1>
  {{title}}
</h1>
<px-spinner>
  <px-inbox height="100vh" list-items='[{"id":"1","title":"GT Vibration","subtitle":"Block 2","severity":"important","date":"2016-10-05T01:29"}]'>
    // define or bind to your details view here
  </px-inbox>

</px-spinner>

现在我对如何在我的项目中使用它感到困惑。请给我一个提示。

由于

Answer 1

我想你正在寻找这样的东西：

schemas: [CUSTOM_ELEMENTS_SCHEMA]

在@NgModule

中

<强> Plunker Example

Answer 2

webcomponents-lite.js polyfill是先决条件according to the readme of px-spinner 。

在index.html中添加以下内容

<script src="bower_components/webcomponentsjs/webcomponents-lite.min.js"></script>

如何在角度2项目

2 个答案: