Angular2 timer with dynnamic image url - Got interpolation ({{}}) where expression was expected

I have a timer that loops from 1 - 3 and on each loop I would like to use the number to load an image with that number in the url.

Component

    import { Component, OnInit, OnDestroy} from "@angular/core";
    import { Observable } from 'rxjs/Observable';
    import { Subscription } from "rxjs";

    @Component({
        selector: 'animated-content',
        template: require('./animated-content.template.html')
    })

    export class AnimatedContentComponent implements OnInit{

        highlightedItem = 1;
        private sub: Subscription;

        constructor(){

        }

        ngOnInit(){
            let timer = Observable.timer(1,2000);
            this.sub = timer.subscribe( t => this.startContentCycle(t))
        }

        private startContentCycle(highlightedItem) {
            if (this.highlightedItem === 3) {
                this.highlightedItem = 1;
            } else {
                this.highlightedItem++;
            }
        }

    }

Template

    <img [src]="/assets/signup-step{{highlightedItem}}.gif" alt="" class="img-responsive">

In assets the images are signup-step1.gif, signup-step2.gif and signup-step3.gif.

I'm getting this error:

'Got interpolation ({{}}) where expression was expected'