src/app/dialogs/formula-syntax/formula-syntax.dialog.ts
Dialog that shows the semantics of the FOL formula syntax.
| styleUrls | ./formula-syntax.dialog.scss |
| templateUrl | ./formula-syntax.dialog.html |
Properties |
|
| Public Readonly columns |
Type : string[]
|
Default value : ['semantics', 'syntax']
|
| Public Readonly dataSource |
Default value : new MatTableDataSource<FOLEntity>(entities)
|
import { Component } from '@angular/core';
import { MatLegacyTableDataSource as MatTableDataSource } from '@angular/material/legacy-table';
interface FOLEntity {
semantics: string;
syntax: string;
}
const entities: FOLEntity[] = [
{ semantics: 'misc.true', syntax: 'tt' },
{ semantics: 'misc.false', syntax: 'ff' },
{ semantics: '∀', syntax: 'forall' },
{ semantics: '∃', syntax: 'exists' },
{ semantics: '¬', syntax: '!' },
{ semantics: '∨', syntax: '|, ||' },
{ semantics: '∧', syntax: '&, &&' },
{ semantics: '→', syntax: '->' },
{ semantics: '↔', syntax: '<->' },
{ semantics: '≐', syntax: '=' },
];
/**
* Dialog that shows the semantics of the FOL formula syntax.
*/
@Component({
templateUrl: './formula-syntax.dialog.html',
styleUrls: ['./formula-syntax.dialog.scss'],
})
export class FormulaSyntaxDialog {
public readonly columns: string[] = ['semantics', 'syntax'];
public readonly dataSource = new MatTableDataSource<FOLEntity>(entities);
}
<table mat-table [dataSource]="dataSource">
<!-- Semantics Column -->
<ng-container matColumnDef="semantics">
<th mat-header-cell *matHeaderCellDef>{{ "misc.semantics" | translate }}</th>
<td mat-cell *matCellDef="let entity">{{ entity.semantics | translate }}</td>
</ng-container>
<!-- Syntax Column -->
<ng-container matColumnDef="syntax">
<th mat-header-cell *matHeaderCellDef>{{ "misc.syntax" | translate }}</th>
<td mat-cell *matCellDef="let entity">{{ entity.syntax }}</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="columns"></tr>
<tr mat-row *matRowDef="let row; columns: columns"></tr>
</table>
./formula-syntax.dialog.scss
.mat-table {
width: 100%;
height: 100%;
}