No edit summary |
No edit summary |
||
Line 20: | Line 20: | ||
====== Getting arbitrary data and display into table cells ====== | ====== Getting arbitrary data and display into table cells ====== | ||
Set the DataIsHtml and send out html in the cell expression as a string | Set the DataIsHtml and send out html in the cell expression as a string: | ||
'<nowiki><div class="tk-data-table__cell NewStyle1">Halloj</div></nowiki>'+self.Attribute2 | |||
[[File:2020-03-23 08h33 26.png|none|thumb|862x862px]] | [[File:2020-03-23 08h33 26.png|none|thumb|862x862px]] | ||
You can make use of the new StylesInModel functionality and reference styles you define in the model: | You can make use of the new StylesInModel functionality and reference styles you define in the model: |
Revision as of 07:38, 23 March 2020
If your data contains html markup and you want the browser to render the html go like this:
Column: IsStatic = True , TaggedValue DataIsHtml=True
Implementation
In Razor the implementation use
Html.Raw(<normal bind>)
In AngularJS it is more complex due to security concerns:
Must inject service $sce. $sce is a service that provides Strict Contextual Escaping services to AngularJS.
We must also use a filter to say that data is trusted as html:
.filter('rawHtml', ['$sce', function($sce) { return function(val) { return $sce.trustAsHtml(val); }; }]);
We then bind like this:
<div ng-bind-html="<normal identifier> | rawHtml"></div>
Getting arbitrary data and display into table cells
Set the DataIsHtml and send out html in the cell expression as a string:
'<div class="tk-data-table__cell NewStyle1">Halloj</div>'+self.Attribute2
You can make use of the new StylesInModel functionality and reference styles you define in the model:
Result: