安装
首先去官网找到安装命令
yarn add ngx-vant
ornpm i ngx-vant
使用
单独创建一个ts文件,把ngx-vant的标签放到里面,这样就可以全局导入了
import { NgModule } from '@angular/core'; import { ButtonModule } from 'ngx-vant/button'; import { CellModule } from 'ngx-vant/cell'; import { CellGroupModule } from 'ngx-vant/cell-group'; import { IconModule } from 'ngx-vant/icon'; import { ImageModule } from 'ngx-vant/image'; import { RowModule } from 'ngx-vant/row'; import { ColModule } from 'ngx-vant/col'; import { FieldModule } from 'ngx-vant/field'; import { PickerModule } from 'ngx-vant/picker'; import { LoadingModule } from 'ngx-vant/loading'; import { PopupModule } from 'ngx-vant/popup'; import { ToastModule } from 'ngx-vant/toast'; import { NotifyModule } from 'ngx-vant/notify'; import { OverlayModule } from 'ngx-vant/overlay'; import { ProgressModule } from 'ngx-vant/progress'; import { StickyModule } from 'ngx-vant/sticky'; import { TagModule } from 'ngx-vant/tag'; import { NavBarModule } from 'ngx-vant/nav-bar'; import { TabsModule } from 'ngx-vant/tabs'; import { TabModule } from 'ngx-vant/tab'; @NgModule({ declarations: [], imports: [ ButtonModule, CellModule, CellGroupModule, IconModule, ImageModule, RowModule, ColModule, FieldModule, PickerModule, NotifyModule, LoadingModule, PopupModule, ToastModule, OverlayModule, ProgressModule, StickyModule, TagModule, NavBarModule, TabsModule, TabModule ], exports: [ ButtonModule, CellModule, CellGroupModule, IconModule, ImageModule, RowModule, ColModule, FieldModule, PickerModule, NotifyModule, LoadingModule, PopupModule, ToastModule, OverlayModule, ProgressModule, StickyModule, TagModule, NavBarModule, TabsModule, TabModule ] }) export class VantModule { }
挂载
在app.module.ts中挂在刚才创建的ts文件
import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { FormsModule } from '@angular/forms'; import { AppComponent } from './app.component'; import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; import { VantModule } from './ui/vant.module'; @NgModule({ declarations: [ AppComponent, ], imports: [ BrowserModule, FormsModule, BrowserAnimationsModule, VantModule ], providers: [ ], bootstrap: [AppComponent] }) export class AppModule { }