For an easy setup of datagrid column features, you can simply specify the property to bind it to
in your model. When you do, the column will benefit from all built-in features for this case:
sorting based on the natural comparison, filtering using either of the built-in filters, and
anything else we might add in the future. You can bind to as deep a property as you want in
your model, using a standard dot-separated syntax:
[clrDgField]="'my.deep.property'"
You can also see in the following example how every feature we offer is always opt-in: we did not declare any binding on the "User ID" column, which means it is not sortable or filterable.
By default, bound columns are assumed to contain string-like contents and the user is presented
with the normal string filter. If you know that the contents of the column will be numeric, you
can instead use the built-in numeric range filter by adding
[clrDgColType]="'number'"
.
You can see an example of this in the "Wins" column.
[clrDgField]
input is a hard-coded
string, so it needs to be quoted twice:
[clrDgField]="'name'"
.
clrDgField="name"
, without
having the extra quotes, but we do not recommend this. In particular, this leaves a
potentially unwanted attribute on the element, whereas the previous syntax only adds
a property to the corresponding Javascript object.