diff --git a/libs/common-docs/src/lib/common/schematics/schematics.component.html b/libs/common-docs/src/lib/common/schematics/schematics.component.html
index e3c89fbff3..bee3230604 100644
--- a/libs/common-docs/src/lib/common/schematics/schematics.component.html
+++ b/libs/common-docs/src/lib/common/schematics/schematics.component.html
@@ -138,7 +138,7 @@
Schematics
],
imports: [
…
- AccordionModule.forRoot(),
+ AccordionModule,
],
bootstrap: [AppComponent]
{{'}'}})
diff --git a/libs/doc-pages/accordion/src/lib/accordion.module.ts b/libs/doc-pages/accordion/src/lib/accordion.module.ts
index 8cdc8ced3e..06e856a2d8 100644
--- a/libs/doc-pages/accordion/src/lib/accordion.module.ts
+++ b/libs/doc-pages/accordion/src/lib/accordion.module.ts
@@ -17,7 +17,7 @@ export { AccordionSectionComponent } from './accordion-section.component';
...DEMO_COMPONENTS
],
imports: [
- AccordionModule.forRoot(),
+ AccordionModule,
CommonModule,
FormsModule,
DocsModule,
diff --git a/libs/doc-pages/accordion/src/lib/docs/usage.md b/libs/doc-pages/accordion/src/lib/docs/usage.md
index 7f803207de..a263020fad 100644
--- a/libs/doc-pages/accordion/src/lib/docs/usage.md
+++ b/libs/doc-pages/accordion/src/lib/docs/usage.md
@@ -5,7 +5,7 @@ import { AccordionModule } from 'ngx-bootstrap/accordion';
@NgModule({
imports: [
BrowserAnimationsModule,
- AccordionModule.forRoot(),
+ AccordionModule,
...
]
})
diff --git a/src/accordion/accordion-group.component.ts b/src/accordion/accordion-group.component.ts
index f0dbc8ecd7..b94979ebec 100644
--- a/src/accordion/accordion-group.component.ts
+++ b/src/accordion/accordion-group.component.ts
@@ -2,6 +2,8 @@ import {
Component, HostBinding, Inject, Input, OnDestroy, OnInit, Output, EventEmitter
} from '@angular/core';
import { AccordionComponent } from './accordion.component';
+import { CollapseModule } from '../collapse/collapse.module';
+import { NgClass, NgIf } from '@angular/common';
/**
* ### Accordion heading
@@ -10,14 +12,16 @@ import { AccordionComponent } from './accordion.component';
* will be used as group's header template.
*/
@Component({
- selector: 'accordion-group, accordion-panel',
- templateUrl: './accordion-group.component.html',
- // eslint-disable-next-line @angular-eslint/no-host-metadata-property
- host: {
- class: 'panel',
- style: 'display: block'
- },
- styleUrls: ['./accordion.scss']
+ selector: 'accordion-group, accordion-panel',
+ templateUrl: './accordion-group.component.html',
+ // eslint-disable-next-line @angular-eslint/no-host-metadata-property
+ host: {
+ class: 'panel',
+ style: 'display: block'
+ },
+ styleUrls: ['./accordion.scss'],
+ standalone: true,
+ imports: [NgClass, NgIf, CollapseModule]
})
export class AccordionPanelComponent implements OnInit, OnDestroy {
/** turn on/off animation */
diff --git a/src/accordion/accordion.component.ts b/src/accordion/accordion.component.ts
index 6fd63d7cfa..c6782fa87a 100644
--- a/src/accordion/accordion.component.ts
+++ b/src/accordion/accordion.component.ts
@@ -4,15 +4,16 @@ import { AccordionConfig } from './accordion.config';
/** Displays collapsible content panels for presenting information in a limited amount of space. */
@Component({
- selector: 'accordion',
- template: ``,
- // eslint-disable-next-line @angular-eslint/no-host-metadata-property
- host: {
- '[attr.aria-multiselectable]': 'closeOthers',
- role: 'tablist',
- class: 'panel-group',
- style: 'display: block'
- }
+ selector: 'accordion',
+ template: ``,
+ // eslint-disable-next-line @angular-eslint/no-host-metadata-property
+ host: {
+ '[attr.aria-multiselectable]': 'closeOthers',
+ role: 'tablist',
+ class: 'panel-group',
+ style: 'display: block'
+ },
+ standalone: true
})
export class AccordionComponent {
/** turn on/off animation */
diff --git a/src/accordion/accordion.module.ts b/src/accordion/accordion.module.ts
index 667f85686d..4dd2978be8 100644
--- a/src/accordion/accordion.module.ts
+++ b/src/accordion/accordion.module.ts
@@ -1,17 +1,10 @@
-import { CommonModule } from '@angular/common';
-import { NgModule, ModuleWithProviders } from '@angular/core';
+import { NgModule } from '@angular/core';
import { AccordionComponent } from './accordion.component';
import { AccordionPanelComponent } from './accordion-group.component';
-import { CollapseModule } from 'ngx-bootstrap/collapse';
@NgModule({
- imports: [CommonModule, CollapseModule],
- declarations: [AccordionComponent, AccordionPanelComponent],
- exports: [AccordionComponent, AccordionPanelComponent]
+ imports: [AccordionComponent, AccordionPanelComponent],
+ exports: [AccordionComponent, AccordionPanelComponent]
})
-export class AccordionModule {
- static forRoot(): ModuleWithProviders {
- return { ngModule: AccordionModule, providers: [] };
- }
-}
+export class AccordionModule {}
diff --git a/src/accordion/testing/accordion.component.spec.ts b/src/accordion/testing/accordion.component.spec.ts
index 335a2c0eee..f10d4e17ab 100644
--- a/src/accordion/testing/accordion.component.spec.ts
+++ b/src/accordion/testing/accordion.component.spec.ts
@@ -4,8 +4,9 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { AccordionConfig, AccordionModule } from '../index';
@Component({
- selector: 'accordion-test',
- template: ''
+ selector: 'accordion-test',
+ template: '',
+ standalone: true
})
class TestAccordionComponent {
oneAtATime = true;
@@ -75,12 +76,12 @@ describe('Component: Accordion', () => {
beforeEach(() => {
TestBed.configureTestingModule({
- declarations: [TestAccordionComponent],
- imports: [
- AccordionModule.forRoot(),
- BrowserAnimationsModule
- ]
- });
+ imports: [
+ AccordionModule,
+ BrowserAnimationsModule,
+ TestAccordionComponent
+ ]
+});
TestBed.overrideComponent(TestAccordionComponent, {
set: { template: html }
});