--- /dev/null
+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);
+ });
+});
+
--- /dev/null
+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}`;
+ }
+}
<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
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',
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');