Using angular 2 to bind a raw html inside a DIV
Version: Angular 2 "2.0.0-rc.1"
References on index.html:
<script src="~/lib/ng/shim.min.js"></script>
<script src="~/lib/ng/zone.min.js"></script>
<script src="~/lib/ng/Reflect.js"></script>
<script src="~/lib/ng/Rx.umd.js"></script>
<script src="~/lib/ng/core.umd.js"></script>
<script src="~/lib/ng/common.umd.js"></script>
<script src="~/lib/ng/compiler.umd.js"></script>
<script src="~/lib/ng/platform-browser.umd.js"></script>
<script src="~/lib/ng/platform-browser-dynamic.umd.js"></script>
index HTML:
...
<div [innerHTML]="name"></div>
...
Javascript:
ng.platformBrowserDynamic.bootstrap(
ng.core
.Component(
selector: 'my-app',
template: <div [innerHTML]="name"></div>
)
.Class(
constructor: function()
{
name = "<div>Testing</div>"
}
)
)
Error:
EXCEPTION: Template parse errors: Can't bind to 'innerhtml' since it isn't a known native property ("
# 1 {{ name }}
][innerhtml]="name"> "): QuestOperationComponent@4:8EXCEPTION: Error: Uncaught (in promise): Template parse errors: Can't bind to 'innerhtml' since it isn't a known native property ("
# 1 {{ name }}
][innerhtml]="name"> "): QuestOperationComponent@4:8
I already tried:
[innerHtml]
[innerHTML]
[inner-Html]
[inner-html]
This one worked for me
<div innerHTML="{{name}}"></div>.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With