fix(flexbox): resolve 'renderer.setStyle()' error

[ThomasBurleson]

• Revert back to Renderer (from Renderer2)

injecting both Renderers causes intermittent DI issues that manifest errors such as TypeError: _this._renderer.setStyle is not a function.

• Refactor the FxBaseDirective to use a StyleRenderer interface

Fixes #270

[ThomasBurleson]

Fixes #270 (comment)

[crisbeto]

LGTM, one minor issue.

[crisbeto]

You can get rid of this one and replace all the usages with the Renderer.

[ThomasBurleson]

Since the BaseFxDirective directive only uses the method setElementStyle() using a StyleRenderer interface clearly declares the intent of the reference.

[ThomasBurleson]

History

Flex-Layout (beta.8) expects a Renderer2 with function ::setStyle() to injected.
Using M2 (beta.5) with the following setup, a Renderer::setElementStyle() is incorrectly injected.

Here is a Plunkr Demo

    <md-tab-group>
      <md-tab>
          <ng-template md-tab-label>
            <span fxShow>tab 1 with fxShow</span>
          </ng-template>
          <md-card fxFlex>
            <md-card-header class="md-primary">
              <b>social identity</b>
            </md-card-header>
            <md-card-content>
              hello world 1
            </md-card-content>
          </md-card>
        </md-tab>
      
        <md-tab label="Password" *ngIf='true'>
          <md-card fxFlex>
            <md-card-header class="md-primary">
              <b>Local identity</b>
            </md-card-header>
            <md-card-content>
              hello world 2
            </md-card-content>
          </md-card>
        </md-tab>
    </md-tab-group>

When the fxShow used inside the <ng-template> is removed, then errors no longer manifest.

[tmburnell]

Do we have any idea when beta.9 will be cut, so the update will be applied to the NPM version?

[ThomasBurleson]

The plan is the end-of next week!

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}