Table works before matTable

client/stillbox/src/app/talkgroup.ts

@@ -15,11 +15,20 @@ export class AlertTime {
 }
 
 export class AlertRule {
-  times: AlertTime[];
+  times: string[];
+  timesProc: AlertTime[];
   mult: number;
 
-  constructor(times: AlertTime[], mult: number) {
+  constructor(times: string[], mult: number) {
     this.times = times;
+    this.timesProc = <AlertTime[]>[];
+    times.forEach((tm) => {
+      let sr = tm.split('+');
+      this.timesProc.push(<AlertTime>{
+        time: sr[0],
+        duration: sr[1],
+      });
+    });
     this.mult = mult;
   }
 }

client/stillbox/src/app/talkgroups/talkgroup-record/alert-rule-builder/alert-rule-builder.component.html

@@ -10,7 +10,7 @@
           </tr>
         </thead>
         <tbody>
-          @for (time of rule.times; track $index) {
+          @for (time of rule | ruleProc; track $index) {
             <tr>
               <td>
                 {{ time.time }}

client/stillbox/src/app/talkgroups/talkgroup-record/alert-rule-builder/alert-rule-builder.component.ts

@@ -1,9 +1,28 @@
-import { Component, Input, Output, EventEmitter } from '@angular/core';
-import { AlertRule } from '../../../talkgroup';
+import {
+  Component,
+  Input,
+  Output,
+  EventEmitter,
+  Pipe,
+  PipeTransform,
+} from '@angular/core';
+import { AlertRule, AlertTime } from '../../../talkgroup';
+
+@Pipe({
+  name: 'ruleProc',
+  standalone: true,
+  pure: true,
+})
+export class AlertRulePipe implements PipeTransform {
+  transform(rule: AlertRule, args?: any): AlertTime[] {
+    let tm = new AlertRule(rule.times, rule.mult);
+    return tm.timesProc;
+  }
+}
 
 @Component({
   selector: 'alert-rule-builder',
-  imports: [],
+  imports: [AlertRulePipe],
   templateUrl: './alert-rule-builder.component.html',
   styleUrl: './alert-rule-builder.component.scss',
 })