Native Angular directives for Bootstrap4
npm install hibiscus.js
-- QQ群①:839128 --
-- QQ群②:839120 --
---
> Native Angular directives for Bootstrap4
* Angular (requires Angular version 4.0.0 or higher)
* Bootstrap CSS (bootstrap-sass 4.0.0)
* DateFns (date-fns 1.27.2 or higher. It is for DatePicker parse & format date)
Notice: OnPush @Input is recommended in @hibiscus.js, so use Immutable.js will be easy.
* Angular 4: version <= 0.0.23; Angular 5: version >= 0.1.0 Angular 6: version >= 0.1.0
- [x] Accordion
- [x] Action button
- [x] Alert Confirm
- [x] Badge
- [x] Breadcrumbs
- [ ] Calendar
- [x] Carousel
- [x] Cascader
- [x] Checkbox Group
- [x] DatePicker
- [x] Dialog
- [ ] Echarts
- [x] File Upload
- [x] Flow Steps
- [x] http
- [x] Image Cropper
- [x] Image Upload
- [x] Infinite Scroll
- [x] Modal
- [x] Message
- [x] Notify
- [x] Notification
- [x] OAuth2
- [x] Overlay
- [x] Pager
- [x] Pagination
- [x] Popconfirm
- [x] Popover
- [x] Progress Bar
- [x] Radio Group
- [x] Rating
- [x] Select
- [x] Select Button
- [x] Storage
- [x] Switch
- [x] Spin
- [x] Tabs
- [x] Tags
- [x] TimePicker
- [x] Tooltip
- [x] Tree View
- [x] Validators
After installing the above dependencies, install @hibiscus.js via:
`` `
npm install --save hibiscus.js
`
Once installed you need to import our main module.`
import { HiNGModule } from 'hibiscus.js';
HiNGModule
Then use to declare on your root module:
`typescript`
@NgModule({
declarations: [
AppComponent,
],
imports: [
BrowserModule,
HiNGModule,
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule {}
And use HiNGModule to declare on your feature module:
`typescript`
@NgModule({
imports: [CommonModule, FormsModule, HiNGModule],
exports: [DatePickerDemoComponent],
declarations: [DatePickerDemoComponent],
providers: [],
})
export class DatePickerDemoModule {}
@hibiscus.js have got animations done. So You should include BrowserAnimationsModule or NoopAnimationsModule to your AppModule.
example:
`typescript
import { BrowserAnimationsModule, NoopAnimationsModule } from '@angular/platform-browser/animations';
@NgModule({
declarations: [
AppComponent,
],
imports: [
BrowserModule,
SharedModule,
HiNGModule,
BrowserAnimationsModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule {}
``