angular 2 condition inside a href

Issue

I have this line of code

<a href="{{banner.url}}"></a>

But sometimes url is null. How can I check it for null and then pass url to href?

I've tried this

<a href="{{banner.url === null ? javascript:void(0) : banner.url}}"></a>

But it throws an error

zone.js:388 Unhandled Promise rejection: Template parse errors:
Parser Error: Got interpolation ({{}}) where expression was expected at column 0 in [{{banner.url === null ? javascript:void(0) : banner.url}}]

Solution

<a [href]="banner.url === null ? 'javascript:void(0)' | safeUrl : banner.url"

With safeUrl being a pipe like shown in https://stackoverflow.com/a/37076868/217408

otherwise javascript:void(0) probably won't be added for security reasons (not tried myself)

Answered By - Günter Zöchbauer