SubForm
+```
+
+## Inherit Form with access to Form
+
+HTML Template with access to form.
+
+```html
+
+```
+
+Code behind file with access to form.
+
+```ts
+import { Component, Input, Output, ViewChild } from '@angular/core';
+import { SacInheritFormDirective } from '@simpleangularcontrols/sac-bootstrap3';
+
+@Component({
+ selector: 'app-subform',
+ templateUrl: './subform.component.html',
+})
+export class DemoSubFormComponent {
+ @Input() mymodel;
+ @Output() mymodelChange = new EventEmitter();
+ @ViewChild('formaccess') public form: SacInheritFormDirective;
+
+ public accessToForm() {
+ console.log(this.form.getForm().dirty);
+ }
+}
+```
diff --git a/ch.jnetwork.sac-controls/projects/sac-bootstrap3/src/controls/form/inheritform.directive.ts b/ch.jnetwork.sac-controls/projects/sac-bootstrap3/src/controls/form/inheritform.directive.ts
index 7d622d19b..ffa1caa49 100644
--- a/ch.jnetwork.sac-controls/projects/sac-bootstrap3/src/controls/form/inheritform.directive.ts
+++ b/ch.jnetwork.sac-controls/projects/sac-bootstrap3/src/controls/form/inheritform.directive.ts
@@ -1,44 +1,17 @@
-import { Directive, SkipSelf } from '@angular/core';
+import { Directive, Injector, SkipSelf } from '@angular/core';
import { ControlContainer, NgForm } from '@angular/forms';
+import { SacFormCommon } from '@simpleangularcontrols/sac-common';
import { SacFormDirective } from './form';
// #region Classes
/**
- * Directive zum erben eines NgForm/NgFormular einer übergeordneten Komponente
- *
- * @example Implementation in Markup
- *
- *
- *
- *
- * @example Model an Sub-Komponente übergeben
- *
- *
- *
SubForm
- *
- *
- *
- *
- *
- *
- * (at)Component({
- * selector: 'sacInheritForm',
- * templateUrl: './subform.component.html'
- * })
- * export class SubFormComponent implements DoCheck {
- *
- * (at)Input() mymodel;
- * (at)Output() mymodelChange = new EventEmitter();
- *
- * ngDoCheck() {
- * this.mymodelChange.next(this.mymodel);
- * }
- *}
- *
+ * Directive to inherit an NgForm/NgForm from a parent component
*/
@Directive({
selector: '[sacInheritForm]',
+ exportAs: 'sacinheritform',
+ standalone: true,
providers: [
{
provide: SacFormDirective,
@@ -51,9 +24,20 @@ import { SacFormDirective } from './form';
deps: [NgForm],
},
],
- standalone: true,
})
-export class SacInheritFormDirective {}
+export class SacInheritFormDirective extends SacFormCommon {
+ // #region Constructors
+
+ /**
+ * Construtor
+ * @param injector: injector to receive the NgForm instance
+ */
+ constructor(injector: Injector) {
+ super(injector.get(NgForm));
+ }
+
+ // #endregion Constructors
+}
// #endregion Classes
diff --git a/ch.jnetwork.sac-controls/projects/sac-bootstrap4/src/controls/form/inheritform.directive.md b/ch.jnetwork.sac-controls/projects/sac-bootstrap4/src/controls/form/inheritform.directive.md
new file mode 100644
index 000000000..e55356d69
--- /dev/null
+++ b/ch.jnetwork.sac-controls/projects/sac-bootstrap4/src/controls/form/inheritform.directive.md
@@ -0,0 +1,46 @@
+# Examples
+
+## Inherit Form
+
+```html
+
+```
+
+## Inherit Form with access to Form
+
+HTML Template with access to form.
+
+```html
+
+```
+
+Code behind file with access to form.
+
+```ts
+import { Component, Input, Output, ViewChild } from '@angular/core';
+import { SacInheritFormDirective } from '@simpleangularcontrols/sac-bootstrap4';
+
+@Component({
+ selector: 'app-subform',
+ templateUrl: './subform.component.html',
+})
+export class DemoSubFormComponent {
+ @Input() mymodel;
+ @Output() mymodelChange = new EventEmitter();
+ @ViewChild('formaccess') public form: SacInheritFormDirective;
+
+ public accessToForm() {
+ console.log(this.form.getForm().dirty);
+ }
+}
+```
diff --git a/ch.jnetwork.sac-controls/projects/sac-bootstrap4/src/controls/form/inheritform.directive.ts b/ch.jnetwork.sac-controls/projects/sac-bootstrap4/src/controls/form/inheritform.directive.ts
index e03d14fe0..304500538 100644
--- a/ch.jnetwork.sac-controls/projects/sac-bootstrap4/src/controls/form/inheritform.directive.ts
+++ b/ch.jnetwork.sac-controls/projects/sac-bootstrap4/src/controls/form/inheritform.directive.ts
@@ -1,17 +1,48 @@
-import { Directive } from '@angular/core';
+import { Directive, Injector, SkipSelf } from '@angular/core';
+import { ControlContainer, NgForm } from '@angular/forms';
+import { SacFormCommon } from '@simpleangularcontrols/sac-common';
import { SacFormDirective } from './form';
-import { SkipSelf } from '@angular/core';
-import { NgForm } from '@angular/forms';
-import { ControlContainer } from '@angular/forms';
+
+// #region Classes
/**
- * Factory Methode für SacForm
- * @param form SacFormular
+ * Directive to inherit an NgForm/NgForm from a parent component
*/
-export function SACFORM_FACTORY(form: SacFormDirective) {
- return form;
+@Directive({
+ selector: '[sacInheritForm]',
+ exportAs: 'sacinheritform',
+ standalone: true,
+ providers: [
+ {
+ provide: SacFormDirective,
+ useFactory: SACFORM_FACTORY,
+ deps: [[new SkipSelf(), SacFormDirective]],
+ },
+ {
+ provide: ControlContainer,
+ useFactory: NGFORM_FACTORY,
+ deps: [NgForm],
+ },
+ ],
+})
+export class SacInheritFormDirective extends SacFormCommon {
+ // #region Constructors
+
+ /**
+ * Construtor
+ * @param injector: injector to receive the NgForm instance
+ */
+ constructor(injector: Injector) {
+ super(injector.get(NgForm));
+ }
+
+ // #endregion Constructors
}
+// #endregion Classes
+
+// #region Functions
+
/**
* Factory Methode für NgForm
* @param form NgForm
@@ -21,51 +52,11 @@ export function NGFORM_FACTORY(form: NgForm) {
}
/**
- * Directive zum erben eines NgForm/NgFormular einer übergeordneten Komponente
- *
- * @example Implementation in Markup
- *
- *
- *
- *
- * @example Model an Sub-Komponente übergeben
- *
- *
- *
SubForm
- *
- *
- *
- *
- *
- *
- * (at)Component({
- * selector: 'sacInheritForm',
- * templateUrl: './subform.component.html'
- * })
- * export class SubFormComponent implements DoCheck {
- *
- * (at)Input() mymodel;
- * (at)Output() mymodelChange = new EventEmitter();
- *
- * ngDoCheck() {
- * this.mymodelChange.next(this.mymodel);
- * }
- *}
- *
+ * Factory Methode für SacForm
+ * @param form SacFormular
*/
-@Directive({
- selector: '[sacInheritForm]',
- providers: [
- {
- provide: SacFormDirective,
- useFactory: SACFORM_FACTORY,
- deps: [[new SkipSelf(), SacFormDirective]]
- }, {
- provide: ControlContainer,
- useFactory: NGFORM_FACTORY,
- deps: [NgForm]
- }
- ],
- standalone: true
-})
-export class SacInheritFormDirective { }
+export function SACFORM_FACTORY(form: SacFormDirective) {
+ return form;
+}
+
+// #endregion Functions
diff --git a/ch.jnetwork.sac-controls/projects/sac-bootstrap4/src/public_api.ts b/ch.jnetwork.sac-controls/projects/sac-bootstrap4/src/public_api.ts
index 657aa779f..b03908260 100644
--- a/ch.jnetwork.sac-controls/projects/sac-bootstrap4/src/public_api.ts
+++ b/ch.jnetwork.sac-controls/projects/sac-bootstrap4/src/public_api.ts
@@ -13,6 +13,7 @@ export * from './controls/datetime/datetime.module';
export * from './controls/dialog/dialog.module';
export * from './controls/form/form';
export * from './controls/form/form.module';
+export * from './controls/form/inheritform.directive';
export * from './controls/grid/grid.module';
export * from './controls/input/input.module';
export * from './controls/layout/layout.module';
diff --git a/ch.jnetwork.sac-controls/projects/sac-bootstrap5/src/controls/form/inheritform.directive.md b/ch.jnetwork.sac-controls/projects/sac-bootstrap5/src/controls/form/inheritform.directive.md
new file mode 100644
index 000000000..2ff575c4d
--- /dev/null
+++ b/ch.jnetwork.sac-controls/projects/sac-bootstrap5/src/controls/form/inheritform.directive.md
@@ -0,0 +1,46 @@
+# Examples
+
+## Inherit Form
+
+```html
+
+```
+
+## Inherit Form with access to Form
+
+HTML Template with access to form.
+
+```html
+
+```
+
+Code behind file with access to form.
+
+```ts
+import { Component, Input, Output, ViewChild } from '@angular/core';
+import { SacInheritFormDirective } from '@simpleangularcontrols/sac-bootstrap5';
+
+@Component({
+ selector: 'app-subform',
+ templateUrl: './subform.component.html',
+})
+export class DemoSubFormComponent {
+ @Input() mymodel;
+ @Output() mymodelChange = new EventEmitter();
+ @ViewChild('formaccess') public form: SacInheritFormDirective;
+
+ public accessToForm() {
+ console.log(this.form.getForm().dirty);
+ }
+}
+```
diff --git a/ch.jnetwork.sac-controls/projects/sac-bootstrap5/src/controls/form/inheritform.directive.ts b/ch.jnetwork.sac-controls/projects/sac-bootstrap5/src/controls/form/inheritform.directive.ts
index 551905891..304500538 100644
--- a/ch.jnetwork.sac-controls/projects/sac-bootstrap5/src/controls/form/inheritform.directive.ts
+++ b/ch.jnetwork.sac-controls/projects/sac-bootstrap5/src/controls/form/inheritform.directive.ts
@@ -1,44 +1,17 @@
-import { Directive, SkipSelf } from '@angular/core';
+import { Directive, Injector, SkipSelf } from '@angular/core';
import { ControlContainer, NgForm } from '@angular/forms';
+import { SacFormCommon } from '@simpleangularcontrols/sac-common';
import { SacFormDirective } from './form';
// #region Classes
/**
- * Directive zum erben eines NgForm/NgFormular einer übergeordneten Komponente
- *
- * @example Implementation in Markup
- *
- *
- *
- *
- * @example Model an Sub-Komponente übergeben
- *
- *
- *
SubForm
- *
- *
- *
- *
- *
- *
- * (at)Component({
- * selector: 'sacInheritForm',
- * templateUrl: './subform.component.html'
- * })
- * export class SubFormComponent implements DoCheck {
- *
- * (at)Input() mymodel;
- * (at)Output() mymodelChange = new EventEmitter();
- *
- * ngDoCheck() {
- * this.mymodelChange.next(this.mymodel);
- * }
- *}
- *
+ * Directive to inherit an NgForm/NgForm from a parent component
*/
@Directive({
selector: '[sacInheritForm]',
+ exportAs: 'sacinheritform',
+ standalone: true,
providers: [
{
provide: SacFormDirective,
@@ -51,9 +24,20 @@ import { SacFormDirective } from './form';
deps: [NgForm],
},
],
- standalone: true,
})
-export class SacInheritFormDirective {}
+export class SacInheritFormDirective extends SacFormCommon {
+ // #region Constructors
+
+ /**
+ * Construtor
+ * @param injector: injector to receive the NgForm instance
+ */
+ constructor(injector: Injector) {
+ super(injector.get(NgForm));
+ }
+
+ // #endregion Constructors
+}
// #endregion Classes
diff --git a/ch.jnetwork.sac-controls/projects/sac-bootstrap5/src/public-api.ts b/ch.jnetwork.sac-controls/projects/sac-bootstrap5/src/public-api.ts
index b7e68204c..f0503b635 100644
--- a/ch.jnetwork.sac-controls/projects/sac-bootstrap5/src/public-api.ts
+++ b/ch.jnetwork.sac-controls/projects/sac-bootstrap5/src/public-api.ts
@@ -13,6 +13,7 @@ export * from './controls/datetime/datetime.module';
export * from './controls/dialog/dialog.module';
export * from './controls/form/form';
export * from './controls/form/form.module';
+export * from './controls/form/inheritform.directive';
export * from './controls/grid/grid.module';
export * from './controls/input/input.module';
export * from './controls/layout/layout.module';