为 angular 库安装 NPM 包
Install NPM package for angular library
我刚刚开始学习 Angular 8 和 CLI,并创建了一个如下所示的项目
ng new my-demo
cd my-demo
ng g library foo --prefix=my
现在我想在我的库中添加 ngx-bootstrap 作为组件并且需要 DropdownButtonModule 所以我的问题是如何为库安装 npm 包?
我按照 link
中的建议进行了尝试
但是构建失败,无法识别 mylibrarymodule.ts 文件中的 DropdownButtonModule 以导入模块
我还需要捆绑库的依赖项
首先从 npm 安装 ngx-bootstrap
npm install ngx-bootstrap --save
将 BsDropdownModule 添加到 NgModule 导入:
import { BsDropdownModule } from 'ngx-bootstrap/dropdown';
@NgModule({
...
imports: [BsDropdownModule.forRoot(),...]
...
})
在您的 HTML 文件中使用它,如下所示。
<div class="btn-group" dropdown>
<button dropdownToggle type="button" class="btn btn-primary dropdown-toggle">
Button dropdown <span class="caret"></span>
</button>
<ul *dropdownMenu class="dropdown-menu" role="menu">
<li role="menuitem"><a class="dropdown-item" href="#">Action</a></li>
<li role="menuitem"><a class="dropdown-item" href="#">Another action</a></li>
<li role="menuitem"><a class="dropdown-item" href="#">Something else here</a></li>
<li class="divider dropdown-divider"></li>
<li role="menuitem"><a class="dropdown-item" href="#">Separated link</a>
</li>
</ul>
</div>
我刚刚开始学习 Angular 8 和 CLI,并创建了一个如下所示的项目
ng new my-demo cd my-demo ng g library foo --prefix=my
现在我想在我的库中添加 ngx-bootstrap 作为组件并且需要 DropdownButtonModule 所以我的问题是如何为库安装 npm 包?
我按照 link
但是构建失败,无法识别 mylibrarymodule.ts 文件中的 DropdownButtonModule 以导入模块
我还需要捆绑库的依赖项
首先从 npm 安装 ngx-bootstrap
npm install ngx-bootstrap --save
将 BsDropdownModule 添加到 NgModule 导入:
import { BsDropdownModule } from 'ngx-bootstrap/dropdown';
@NgModule({
...
imports: [BsDropdownModule.forRoot(),...]
...
})
在您的 HTML 文件中使用它,如下所示。
<div class="btn-group" dropdown>
<button dropdownToggle type="button" class="btn btn-primary dropdown-toggle">
Button dropdown <span class="caret"></span>
</button>
<ul *dropdownMenu class="dropdown-menu" role="menu">
<li role="menuitem"><a class="dropdown-item" href="#">Action</a></li>
<li role="menuitem"><a class="dropdown-item" href="#">Another action</a></li>
<li role="menuitem"><a class="dropdown-item" href="#">Something else here</a></li>
<li class="divider dropdown-divider"></li>
<li role="menuitem"><a class="dropdown-item" href="#">Separated link</a>
</li>
</ul>
</div>