angular 2 condition inside a href

Question

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}}]

score 6 · Accepted Answer · edited May 23 '17 at 12:32

6

<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)

edited May 23 '17 at 12:32

Community

1
1

answered Mar 23 '17 at 06:38

Günter Zöchbauer

558,509
191
1,911
1,506

score 0 · Answer 2 · answered Mar 23 '17 at 06:36

0

<a href="{{banner?.url || '#'}}"></a>

change # with your default URL

answered Mar 23 '17 at 06:36

Pardeep Jain

78,495
36
155
210

angular 2 condition inside a href

2 Answers2