# Typsichers Binding für matSortDirection



## Quaneu (28. Okt 2021)

Hallo zusammen,

ich benutze Angular und Martial (12.2.11). Ich will nun folgendes Binding:
html:
[CODE lang="html" title="Binding"]<table mat-table ... matSortDirection="{{sortOrder}}">[/CODE]
ts:
[CODE lang="java" title="Code"]  public sortOrder: SortDirection = '';[/CODE]

Leider bekomme ich jedoch diesen Fehler:


> Type 'string' is not assignable to type 'SortDirection'.



Wenn ich anstatt {{sortOrder}} z.B. "asc" schreibe geht es.

Was muss ich machen, damit das Binding typsicher funktioniert.

Schöne Grüße
Quaneu


----------



## Flown (28. Okt 2021)

```
<table mat-table ... [matSortDirection]="sortOrder">
```

Bindingerklärung HIER


----------



## Quaneu (28. Okt 2021)

Vielen Dank für die schnelle Antwort.

Jetzt hätte ich noch eine Frage dazu. Denn ich denke es sollte schon bei



> matSortDirection="{{sortOrder}}"



bleiben, da dies eine Initialisierung ist. Binding ist wohl an dieser Stelle das falsche Wort, Entschuldige.

Hier das "ganze" Beispiel:
[CODE lang="html" title="Html"]<table mat-table [dataSource]="data" [hidden]="!data"
       matSort (matSortChange)="loadData()"
       matSortActive="{{sortColumn}}" matSortDirection="{{sortOrder}}">[/CODE]

Ich lese gerade ein Buch und in diesem ist dieses Beispiel, leider lässt es sich bei mir nicht kompilieren, da die Checks strenger sind. Jedoch würde ich sie dabei belassen, wenn es geht. D.h. an dieser Stelle typsicher bleiben.


----------



## Flown (28. Okt 2021)

Das eine ist ein Binding - wie ich es dir gezeigt habe, das andere was du machst ist eine Text interpolation (HIER). Typsicher fährst du auf jedefall mit dem Binding.


----------



## Quaneu (28. Okt 2021)

Ok. Danke. Dann ändere ich es zu einem Binding.

Was ich noch nicht ganz verstehe, matSortDirection="asc" geht.

Bei der Text interpolation steht 


> More generally, the text between the braces is a template expression that Angular first evaluates and then converts to a string.



D.h. am Ende steht auch der string "asc" (wenn die Variable den Wert hat).

Sorry, aber ich würde das nur noch verstehen wollen, denn habe ich nichts in dem Buch gefunde.


----------



## mrBrown (28. Okt 2021)

Quaneu hat gesagt.:


> Bei der Text interpolation steht
> 
> 
> > More generally, the text between the braces is a template expression that Angular first evaluates and then converts to a string.
> ...


"asc" ist der Wert, der Typ ist durch die "template expression" aber string, und: "Type 'string' is not assignable to type 'SortDirection'"


----------



## Flown (28. Okt 2021)

Die Frage ist wann der Wert evaluiert wird.
Bei der text interpolation steht auch dabei, dass sie idempodent sein sollte (side-effect-free). Was dein change nicht ist, weil die table damit verändert wird.
Auch die change-detection läuft hier anders und kann zu Fehlern führen.

Wenn du den Wert nicht verändern möchtest, sondern das von code->view bringen möchtest (und somit die view steuern) musst du das mit bindings machen. Wenn du Werte anzeigen möchtest, dann mit interpolation.

Wenn es sich so und so nicht ändert, dann lass es einfach auf matSortDirection="asc", keinen Grund das via Variable zu lösen.


----------



## mrBrown (28. Okt 2021)

Flown hat gesagt.:


> Bei der text interpolation steht auch dabei, dass sie idempodent sein sollte (side-effect-free).


Das dürfte sich doch nur auf die Interpolation selbst beziehen, und die ist, solange primitive Werte benutzt weden, immer idempodent & side-effect-free?

Geht dabei doch eher um Dinge wie in der Expression Methoden aufrufen, die anderen Zustand ändern.


----------



## Quaneu (28. Okt 2021)

Wie gesagt, das ist ein Beispiel aus dem Buch "ASP.NET Core 5 and Angular". Und sie setzen im Code den default, was ich nicht ganz so schelcht finde, da dies auch nicht ins html gehört, finde ich.

Ok. D.h. wenn ich "asc" schreibe ist es schon kein "string" mehr und bei der Interpolation ist es sicher ein string. 

Damit kann ich erstmal leben 

Vielen Dank für eure Hilfe


----------



## Flown (28. Okt 2021)

mrBrown hat gesagt.:


> Das dürfte sich doch nur auf die Interpolation selbst beziehen, und die ist, solange primitive Werte benutzt weden, immer idempodent & side-effect-free?


Du hast recht ... ich hätte auch aufmerksamer darüber fliegen sollen.


Quaneu hat gesagt.:


> Ok. D.h. wenn ich "asc" schreibe ist es schon kein "string" mehr und bei der Interpolation ist es sicher ein string.


Wenn die view gerendet ist, dann steht, egal aus welcher quelle, asc drinnen.


----------



## mrBrown (28. Okt 2021)

Quaneu hat gesagt.:


> Ok. D.h. wenn ich "asc" schreibe ist es schon kein "string" mehr und bei der Interpolation ist es sicher ein string.



In beiden Fällen ist der Laufzeit-Typ string. Typescript kennt aber "Literal Types", "asc" hat dann den Typ "asc", und nicht nur string.


----------

