LP2018410 DOM AutoId Service user/berick/lp2018410-dom-auto-id
authorBill Erickson <berickxx@gmail.com>
Tue, 30 May 2023 15:11:24 +0000 (11:11 -0400)
committerBill Erickson <berickxx@gmail.com>
Tue, 30 May 2023 15:11:27 +0000 (11:11 -0400)
Usage:

<label [for]="myInput.id">I'm a Label</label>
<input #myInput [id]="autoId.next(myInput)"/>

Signed-off-by: Bill Erickson <berickxx@gmail.com>
Open-ILS/src/eg2/src/app/share/util/autoid.service.spec.ts [new file with mode: 0644]
Open-ILS/src/eg2/src/app/share/util/autoid.service.ts [new file with mode: 0644]
Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.html
Open-ILS/src/eg2/src/app/staff/sandbox/sandbox.component.ts

diff --git a/Open-ILS/src/eg2/src/app/share/util/autoid.service.spec.ts b/Open-ILS/src/eg2/src/app/share/util/autoid.service.spec.ts
new file mode 100644 (file)
index 0000000..8801766
--- /dev/null
@@ -0,0 +1,20 @@
+import {AutoIdService} from './autoid.service';
+
+let autoId: AutoIdService;
+
+beforeEach(() => {
+    autoId = new AutoIdService();
+});
+
+describe('AutoId', () => {
+    it('Should always increase', () => {
+        expect(autoId.next() < autoId.next()).toBe(true);
+    });
+    it('Should always increase', () => {
+        expect(autoId.next() < autoId.next()).toBe(true);
+    });
+    it('Should always increase', () => {
+        expect(autoId.next() < autoId.next()).toBe(true);
+    });
+});
+
diff --git a/Open-ILS/src/eg2/src/app/share/util/autoid.service.ts b/Open-ILS/src/eg2/src/app/share/util/autoid.service.ts
new file mode 100644 (file)
index 0000000..c49e29a
--- /dev/null
@@ -0,0 +1,17 @@
+import {Injectable} from '@angular/core';
+
+@Injectable({providedIn: 'root'})
+export class AutoIdService {
+    static seed = 0;
+
+    // Returns the next generated ID.
+    next(elm?: any): string {
+        // If the element has an ID, keep it.  Otherwise, we end up
+        // auto-generating IDs repeatedly for the same element for
+        // every page load.
+        if (elm && elm.id) { return elm.id; }
+
+        AutoIdService.seed++;
+        return `auto-${AutoIdService.seed}`;
+    }
+}
index e9737bc..a06e715 100644 (file)
@@ -2,6 +2,7 @@
 <eg-staff-banner bannerText="Sandbox" i18n-bannerText>
 </eg-staff-banner>
 
+
 <eg-title 
   i18n-prefix i18n-suffix
   prefix=":) {{dynamicTitleText}}"
   </div>
 </div>
 
+<!-- auto id -->
+
+<label [for]="myInput.id">I'm a Label</label>
+<input #myInput [id]="autoId.next(myInput)"/>
+
 <!-- FM Editor Experiments ----------------------------- -->
 <div class="row mb-3">
   <ng-template #descriptionTemplate 
index edc35ac..db4d760 100644 (file)
@@ -23,6 +23,7 @@ import {GridComponent} from '@eg/share/grid/grid.component';
 import * as Moment from 'moment-timezone';
 import {SampleDataService} from '@eg/share/util/sample-data.service';
 import {HtmlToTxtService} from '@eg/share/util/htmltotxt.service';
+import {AutoIdService} from '@eg/share/util/autoid.service';
 
 @Component({
   templateUrl: 'sandbox.component.html',
@@ -129,8 +130,10 @@ export class SandboxComponent implements OnInit {
         private format: FormatService,
         private printer: PrintService,
         private samples: SampleDataService,
-        private h2txt: HtmlToTxtService
+        private h2txt: HtmlToTxtService,
+        public autoId: AutoIdService,
     ) {
+
         // BroadcastChannel is not yet defined in PhantomJS and elsewhere
         this.sbChannel = (typeof BroadcastChannel === 'undefined') ?
             {} : new BroadcastChannel('eg.sbChannel');