Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

MdTab: Add property to determine if the tab is active #6422

Closed
lukas-shawford opened this issue Aug 11, 2017 · 1 comment · Fixed by #6424
Closed

MdTab: Add property to determine if the tab is active #6422

lukas-shawford opened this issue Aug 11, 2017 · 1 comment · Fixed by #6424
Assignees
Labels
feature This issue represents a new feature or feature request rather than a bug or bug fix help wanted The team would appreciate a PR from the community to address this issue P4 A relatively minor issue that is not relevant to core functions

Comments

@lukas-shawford
Copy link

Bug, feature request, or proposal:

Feature request

What is the expected behavior?

It would be helpful to have a property on MdTab that returns true if it is the currently active tab.

What is the current behavior?

Seems like the only way to get the active tab is via the selectedIndex property in MdTabGroup. Even then, it returns an index, rather than an instance of MdTab. There does not seem to be a straightforward way to get the MdTab instance based on the index, other than to use MdTabGroup._tabs.find (which also doesn't seem right, since _tabs is not part of the public API).

What is the use-case or motivation for changing an existing behavior?

Lots of reasons why someone might want this. In my case, I'm trying to avoid instantiating a component until the tab gets selected (partly for performance, and also because the component does not function correctly if it is initially rendered in a hidden container).

Ideally, I would like to do something like this:

<md-tab-group>
  <md-tab #mapTab label="Map">
    <div *ngIf="mapTab.isActive">
      <agm-map ...></agm-map>
    </div>
  </md-tab>
</md-tab-group>

However, to my knowledge, there is no such property as isActive (or similar) available on MdTab.

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

2.0.0-beta.8

@jelbourn jelbourn added feature This issue represents a new feature or feature request rather than a bug or bug fix help wanted The team would appreciate a PR from the community to address this issue P4 A relatively minor issue that is not relevant to core functions labels Aug 11, 2017
@crisbeto crisbeto self-assigned this Aug 11, 2017
crisbeto added a commit to crisbeto/material2 that referenced this issue Aug 11, 2017
* Adds the `isActive` flag on each tab, making it easier to check whether a tab is active.
* Adds an `exportAs` to the tab directive to allow for it to be consumed easier in the view.

Fixes angular#6422.
crisbeto added a commit to crisbeto/material2 that referenced this issue Aug 14, 2017
* Adds the `isActive` flag on each tab, making it easier to check whether a tab is active.
* Adds an `exportAs` to the tab directive to allow for it to be consumed easier in the view.

Fixes angular#6422.
andrewseguin pushed a commit that referenced this issue Aug 16, 2017
* Adds the `isActive` flag on each tab, making it easier to check whether a tab is active.
* Adds an `exportAs` to the tab directive to allow for it to be consumed easier in the view.

Fixes #6422.
@angular-automatic-lock-bot
Copy link

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.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 6, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
feature This issue represents a new feature or feature request rather than a bug or bug fix help wanted The team would appreciate a PR from the community to address this issue P4 A relatively minor issue that is not relevant to core functions
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants