md-carousel indicators do not show correct state

[OtherLeadingBrand]

The carousel indicators do not properly reflect the index in the slide deck as you navigate using the indicators. This is because two sets of indicators are rendered with one overlaying the other:

<ul class="indicators">
<li class="indicator-item active"></li>
<li class="indicator-item"></li>
</ul>

<ul class="indicators">
<li class="indicator-item"></li>
<li class="indicator-item active"></li>
</ul>

The root cause appears to be that the MDCarousel init is called twice. Once due to the itemsChanged() event and another due to attached().

A quick workaround was to insure the instance was not already instantiated before creating a new one. (see below) However I'm not sure if this change would break functionality if someone has used the carousel in a way that dynamically adds items at runtime.

carousel.ts

    refresh() {
        if (!this.items.length) {
            return;
        }
        const options: Partial<M.CarouselOptions> = {
            fullWidth: this.fullWidth,
            indicators: this.indicators,
            dist: this.dist,
            duration: this.duration,
            noWrap: this.noWrap,
            numVisible: this.numVisible,
            padding: this.padding,
            shift: this.shift,
            onCycleTo: (current, dragged) => au.fireMaterializeEvent(this.element, "cycle-to", { current, dragged })
        };
        au.cleanOptions(options);
        this.taskQueue.queueTask(() => {
            if (!this.instance) {
            this.instance = new M.Carousel(this.element, options);
            }
        });
    }

I attempted to create an example gist for the issue but unfortunately it does not run: https://gist.run/?id=1b9230bfaee04ec5d6d0082655fae549

[MaximBalaganskiy]

Fixed via 2e6ea00823781cbc24969df6da1c8ed820b29e4f

[OtherLeadingBrand]

Thanks @MaximBalaganskiy this fixed the issue.