From 08388285eb07b30d92a74f1536c71b05cde30d86 Mon Sep 17 00:00:00 2001 From: Paul Gschwendtner Date: Thu, 28 Sep 2017 19:21:30 +0200 Subject: [PATCH] fix(): add exportAs to missing components * Adds the `exportAs` option to the missing components inside of Angular Material Fixes #7361 --- src/cdk/observers/observe-content.ts | 3 ++- src/cdk/portal/portal-directives.ts | 1 + src/cdk/stepper/stepper.ts | 2 ++ src/cdk/table/table.ts | 1 + src/lib/button-toggle/button-toggle.ts | 1 + src/lib/button/button.ts | 2 ++ src/lib/card/card.ts | 2 ++ src/lib/checkbox/checkbox.ts | 1 + src/lib/chips/chip-input.ts | 1 + src/lib/core/option/optgroup.ts | 1 + src/lib/core/option/option.ts | 1 + src/lib/datepicker/datepicker.ts | 1 + src/lib/dialog/dialog-content-directives.ts | 2 ++ src/lib/expansion/accordion.ts | 2 ++ src/lib/expansion/expansion-panel.ts | 1 + src/lib/form-field/form-field.ts | 1 + src/lib/grid-list/grid-list.ts | 1 + src/lib/grid-list/grid-tile.ts | 1 + src/lib/icon/icon.ts | 1 + src/lib/input/input.ts | 1 + src/lib/list/list.ts | 2 ++ src/lib/list/selection-list.ts | 2 ++ src/lib/menu/menu-item.ts | 2 +- src/lib/paginator/paginator.ts | 1 + src/lib/progress-bar/progress-bar.ts | 1 + src/lib/progress-spinner/progress-spinner.ts | 1 + src/lib/radio/radio.ts | 2 ++ src/lib/select/select.ts | 2 +- src/lib/sidenav/drawer.ts | 2 ++ src/lib/sidenav/sidenav.ts | 2 ++ src/lib/slider/slider.ts | 1 + src/lib/stepper/stepper.ts | 3 +++ src/lib/table/row.ts | 2 ++ src/lib/table/table.ts | 1 + src/lib/tabs/tab-group.ts | 1 + src/lib/tabs/tab-nav-bar/tab-nav-bar.ts | 2 ++ src/lib/toolbar/toolbar.ts | 2 ++ src/lib/tooltip/tooltip.ts | 2 +- 38 files changed, 54 insertions(+), 4 deletions(-) diff --git a/src/cdk/observers/observe-content.ts b/src/cdk/observers/observe-content.ts index c0b8dff10ecb..e7939a4922dd 100644 --- a/src/cdk/observers/observe-content.ts +++ b/src/cdk/observers/observe-content.ts @@ -37,7 +37,8 @@ export class MatMutationObserverFactory { * its associated element has changed. */ @Directive({ - selector: '[cdkObserveContent]' + selector: '[cdkObserveContent]', + exportAs: 'cdkObserveContent', }) export class ObserveContent implements AfterContentInit, OnDestroy { private _observer: MutationObserver | null; diff --git a/src/cdk/portal/portal-directives.ts b/src/cdk/portal/portal-directives.ts index a0a30560dfba..74a64ccb9203 100644 --- a/src/cdk/portal/portal-directives.ts +++ b/src/cdk/portal/portal-directives.ts @@ -49,6 +49,7 @@ export class TemplatePortalDirective extends TemplatePortal { */ @Directive({ selector: '[cdkPortalHost], [portalHost]', + exportAs: 'cdkPortalHost, portalHost', inputs: ['portal: cdkPortalHost'] }) export class PortalHostDirective extends BasePortalHost implements OnDestroy { diff --git a/src/cdk/stepper/stepper.ts b/src/cdk/stepper/stepper.ts index 30b12781b759..27d5a0008c92 100644 --- a/src/cdk/stepper/stepper.ts +++ b/src/cdk/stepper/stepper.ts @@ -59,6 +59,7 @@ export class StepperSelectionEvent { @Component({ moduleId: module.id, selector: 'cdk-step', + exportAs: 'cdkStep', templateUrl: 'step.html', encapsulation: ViewEncapsulation.None, preserveWhitespaces: false, @@ -119,6 +120,7 @@ export class CdkStep { @Directive({ selector: '[cdkStepper]', + exportAs: 'cdkStepper', }) export class CdkStepper { /** The list of step components that the stepper is holding. */ diff --git a/src/cdk/table/table.ts b/src/cdk/table/table.ts index a76b8afed00d..c30a10f6255e 100644 --- a/src/cdk/table/table.ts +++ b/src/cdk/table/table.ts @@ -71,6 +71,7 @@ export const CDK_TABLE_TEMPLATE = ` @Component({ moduleId: module.id, selector: 'cdk-table', + exportAs: 'cdkTable', template: CDK_TABLE_TEMPLATE, host: { 'class': 'cdk-table', diff --git a/src/lib/button-toggle/button-toggle.ts b/src/lib/button-toggle/button-toggle.ts index 7bc8fa72da90..100daaf4fc19 100644 --- a/src/lib/button-toggle/button-toggle.ts +++ b/src/lib/button-toggle/button-toggle.ts @@ -263,6 +263,7 @@ export class MatButtonToggleGroupMultiple extends _MatButtonToggleGroupMixinBase styleUrls: ['button-toggle.css'], encapsulation: ViewEncapsulation.None, preserveWhitespaces: false, + exportAs: 'matButtonToggle', changeDetection: ChangeDetectionStrategy.OnPush, host: { '[class.mat-button-toggle-standalone]': '!buttonToggleGroup && !buttonToggleGroupMultiple', diff --git a/src/lib/button/button.ts b/src/lib/button/button.ts index 3d498f4189c1..13c0fbb4ad5a 100644 --- a/src/lib/button/button.ts +++ b/src/lib/button/button.ts @@ -116,6 +116,7 @@ export const _MatButtonMixinBase = mixinColor(mixinDisabled(mixinDisableRipple(M moduleId: module.id, selector: `button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab]`, + exportAs: 'matButton', host: { '[disabled]': 'disabled || null', }, @@ -181,6 +182,7 @@ export class MatButton extends _MatButtonMixinBase @Component({ moduleId: module.id, selector: `a[mat-button], a[mat-raised-button], a[mat-icon-button], a[mat-fab], a[mat-mini-fab]`, + exportAs: 'matButton, matAnchor', host: { '[attr.tabindex]': 'disabled ? -1 : 0', '[attr.disabled]': 'disabled || null', diff --git a/src/lib/card/card.ts b/src/lib/card/card.ts index fc1e7a34ace3..7c39254b93fa 100644 --- a/src/lib/card/card.ts +++ b/src/lib/card/card.ts @@ -55,6 +55,7 @@ export class MatCardSubtitle {} */ @Directive({ selector: 'mat-card-actions', + exportAs: 'matCardActions', host: { 'class': 'mat-card-actions', '[class.mat-card-actions-align-end]': 'align === "end"', @@ -150,6 +151,7 @@ export class MatCardAvatar {} @Component({ moduleId: module.id, selector: 'mat-card', + exportAs: 'matCard', templateUrl: 'card.html', styleUrls: ['card.css'], encapsulation: ViewEncapsulation.None, diff --git a/src/lib/checkbox/checkbox.ts b/src/lib/checkbox/checkbox.ts index 97ffec3de20d..d94a129e4a6d 100644 --- a/src/lib/checkbox/checkbox.ts +++ b/src/lib/checkbox/checkbox.ts @@ -95,6 +95,7 @@ export const _MatCheckboxMixinBase = selector: 'mat-checkbox', templateUrl: 'checkbox.html', styleUrls: ['checkbox.css'], + exportAs: 'matCheckbox', host: { 'class': 'mat-checkbox', '[id]': 'id', diff --git a/src/lib/chips/chip-input.ts b/src/lib/chips/chip-input.ts index b014dd52b756..df8975a04f42 100644 --- a/src/lib/chips/chip-input.ts +++ b/src/lib/chips/chip-input.ts @@ -23,6 +23,7 @@ export interface MatChipInputEvent { */ @Directive({ selector: 'input[matChipInputFor]', + exportAs: 'matChipInput, matChipInputFor', host: { 'class': 'mat-chip-input mat-input-element', '(keydown)': '_keydown($event)', diff --git a/src/lib/core/option/optgroup.ts b/src/lib/core/option/optgroup.ts index 7315448e8421..0524c384ac3b 100644 --- a/src/lib/core/option/optgroup.ts +++ b/src/lib/core/option/optgroup.ts @@ -23,6 +23,7 @@ let _uniqueOptgroupIdCounter = 0; @Component({ moduleId: module.id, selector: 'mat-optgroup', + exportAs: 'matOptgroup', templateUrl: 'optgroup.html', encapsulation: ViewEncapsulation.None, preserveWhitespaces: false, diff --git a/src/lib/core/option/option.ts b/src/lib/core/option/option.ts index b7061303225c..ec287fa4bc0a 100644 --- a/src/lib/core/option/option.ts +++ b/src/lib/core/option/option.ts @@ -39,6 +39,7 @@ export class MatOptionSelectionChange { @Component({ moduleId: module.id, selector: 'mat-option', + exportAs: 'matOption', host: { 'role': 'option', '[attr.tabindex]': '_getTabIndex()', diff --git a/src/lib/datepicker/datepicker.ts b/src/lib/datepicker/datepicker.ts index 8c9d10adafb3..cb4a6b0e1323 100644 --- a/src/lib/datepicker/datepicker.ts +++ b/src/lib/datepicker/datepicker.ts @@ -120,6 +120,7 @@ export class MatDatepickerContent implements AfterContentInit { moduleId: module.id, selector: 'mat-datepicker', template: '', + exportAs: 'matDatepicker', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, preserveWhitespaces: false, diff --git a/src/lib/dialog/dialog-content-directives.ts b/src/lib/dialog/dialog-content-directives.ts index 99dd5c900c02..3717cef1449c 100644 --- a/src/lib/dialog/dialog-content-directives.ts +++ b/src/lib/dialog/dialog-content-directives.ts @@ -18,6 +18,7 @@ let dialogElementUid = 0; */ @Directive({ selector: `button[mat-dialog-close], button[matDialogClose]`, + exportAs: 'matDialogClose', host: { '(click)': 'dialogRef.close(dialogResult)', '[attr.aria-label]': 'ariaLabel', @@ -49,6 +50,7 @@ export class MatDialogClose implements OnChanges { */ @Directive({ selector: '[mat-dialog-title], [matDialogTitle]', + exportAs: 'matDialogTitle', host: { 'class': 'mat-dialog-title', '[id]': 'id', diff --git a/src/lib/expansion/accordion.ts b/src/lib/expansion/accordion.ts index 17c72e0a2831..7c60ff0c5725 100644 --- a/src/lib/expansion/accordion.ts +++ b/src/lib/expansion/accordion.ts @@ -20,6 +20,7 @@ let nextId = 0; */ @Directive({ selector: 'cdk-accordion, [cdk-accordion]', + exportAs: 'cdkAccordion', }) export class CdkAccordion { /** A readonly id value to use for unique selection coordination. */ @@ -51,6 +52,7 @@ export class CdkAccordion { */ @Directive({ selector: 'mat-accordion', + exportAs: 'matAccordion', host: { class: 'mat-accordion' } diff --git a/src/lib/expansion/expansion-panel.ts b/src/lib/expansion/expansion-panel.ts index cf4a209f4c9d..97f00bfc7b82 100644 --- a/src/lib/expansion/expansion-panel.ts +++ b/src/lib/expansion/expansion-panel.ts @@ -56,6 +56,7 @@ export const EXPANSION_PANEL_ANIMATION_TIMING = '225ms cubic-bezier(0.4,0.0,0.2, moduleId: module.id, styleUrls: ['./expansion-panel.css'], selector: 'mat-expansion-panel', + exportAs: 'matExpansionPanel', templateUrl: './expansion-panel.html', encapsulation: ViewEncapsulation.None, preserveWhitespaces: false, diff --git a/src/lib/form-field/form-field.ts b/src/lib/form-field/form-field.ts index 75c2991d6b5f..84aed732bc2d 100644 --- a/src/lib/form-field/form-field.ts +++ b/src/lib/form-field/form-field.ts @@ -53,6 +53,7 @@ let nextUniqueId = 0; moduleId: module.id, // TODO(mmalerba): the input-container selectors and classes are deprecated and will be removed. selector: 'mat-input-container, mat-form-field', + exportAs: 'matFormField, matInputContainer', templateUrl: 'form-field.html', // MatInput is a directive and can't have styles, so we need to include its styles here. // The MatInput styles are fairly minimal so it shouldn't be a big deal for people who diff --git a/src/lib/grid-list/grid-list.ts b/src/lib/grid-list/grid-list.ts index dbd3b2a74bd2..a961b449d2b1 100644 --- a/src/lib/grid-list/grid-list.ts +++ b/src/lib/grid-list/grid-list.ts @@ -38,6 +38,7 @@ const MAT_FIT_MODE = 'fit'; @Component({ moduleId: module.id, selector: 'mat-grid-list', + exportAs: 'matGridList', templateUrl: 'grid-list.html', styleUrls: ['grid-list.css'], host: { diff --git a/src/lib/grid-list/grid-tile.ts b/src/lib/grid-list/grid-tile.ts index 7f0e14f3780a..0d4a41bbf8e9 100644 --- a/src/lib/grid-list/grid-tile.ts +++ b/src/lib/grid-list/grid-tile.ts @@ -24,6 +24,7 @@ import {coerceToNumber} from './grid-list-measure'; @Component({ moduleId: module.id, selector: 'mat-grid-tile', + exportAs: 'matGridTile', host: { 'class': 'mat-grid-tile', }, diff --git a/src/lib/icon/icon.ts b/src/lib/icon/icon.ts index 8f52ee3ba010..f29e96d04ed9 100644 --- a/src/lib/icon/icon.ts +++ b/src/lib/icon/icon.ts @@ -62,6 +62,7 @@ export const _MatIconMixinBase = mixinColor(MatIconBase); moduleId: module.id, template: '', selector: 'mat-icon', + exportAs: 'matIcon', styleUrls: ['icon.css'], inputs: ['color'], host: { diff --git a/src/lib/input/input.ts b/src/lib/input/input.ts index c8f357117244..c47b67876185 100644 --- a/src/lib/input/input.ts +++ b/src/lib/input/input.ts @@ -51,6 +51,7 @@ let nextUniqueId = 0; /** Directive that allows a native input to work inside a `MatFormField`. */ @Directive({ selector: `input[matInput], textarea[matInput]`, + exportAs: 'matInput', host: { 'class': 'mat-input-element mat-form-field-autofill-control', // Native input properties that are overwritten by Angular inputs need to be synced with diff --git a/src/lib/list/list.ts b/src/lib/list/list.ts index ab7d90daa514..6cb85860c0a5 100644 --- a/src/lib/list/list.ts +++ b/src/lib/list/list.ts @@ -46,6 +46,7 @@ export class MatListDivider {} @Component({ moduleId: module.id, selector: 'mat-list, mat-nav-list', + exportAs: 'matList, matNavList', host: {'role': 'list'}, template: '', styleUrls: ['list.css'], @@ -120,6 +121,7 @@ export class MatListSubheaderCssMatStyler {} @Component({ moduleId: module.id, selector: 'mat-list-item, a[mat-list-item]', + exportAs: 'matListItem', host: { 'role': 'listitem', 'class': 'mat-list-item', diff --git a/src/lib/list/selection-list.ts b/src/lib/list/selection-list.ts index 3f939fa600c7..301f10c55a4c 100644 --- a/src/lib/list/selection-list.ts +++ b/src/lib/list/selection-list.ts @@ -64,6 +64,7 @@ const FOCUSED_STYLE: string = 'mat-list-item-focus'; @Component({ moduleId: module.id, selector: 'mat-list-option', + exportAs: 'matListOption', inputs: ['disableRipple'], host: { 'role': 'option', @@ -187,6 +188,7 @@ export class MatListOption extends _MatListOptionMixinBase @Component({ moduleId: module.id, selector: 'mat-selection-list', + exportAs: 'matSelectionList', inputs: ['disabled', 'disableRipple'], host: { 'role': 'listbox', diff --git a/src/lib/menu/menu-item.ts b/src/lib/menu/menu-item.ts index c08a7e39cf3a..23c32ddb84f9 100644 --- a/src/lib/menu/menu-item.ts +++ b/src/lib/menu/menu-item.ts @@ -29,6 +29,7 @@ export const _MatMenuItemMixinBase = mixinDisabled(MatMenuItemBase); @Component({ moduleId: module.id, selector: '[mat-menu-item]', + exportAs: 'matMenuItem', inputs: ['disabled'], host: { 'role': 'menuitem', @@ -45,7 +46,6 @@ export const _MatMenuItemMixinBase = mixinDisabled(MatMenuItemBase); encapsulation: ViewEncapsulation.None, preserveWhitespaces: false, templateUrl: 'menu-item.html', - exportAs: 'matMenuItem', }) export class MatMenuItem extends _MatMenuItemMixinBase implements FocusableOption, CanDisable, OnDestroy { diff --git a/src/lib/paginator/paginator.ts b/src/lib/paginator/paginator.ts index 5e45fd2a1205..5b4a4126cff3 100644 --- a/src/lib/paginator/paginator.ts +++ b/src/lib/paginator/paginator.ts @@ -46,6 +46,7 @@ export class PageEvent { @Component({ moduleId: module.id, selector: 'mat-paginator', + exportAs: 'matPaginator', templateUrl: 'paginator.html', styleUrls: ['paginator.css'], host: { diff --git a/src/lib/progress-bar/progress-bar.ts b/src/lib/progress-bar/progress-bar.ts index 2396d693e012..e97d9b03ec05 100644 --- a/src/lib/progress-bar/progress-bar.ts +++ b/src/lib/progress-bar/progress-bar.ts @@ -18,6 +18,7 @@ import {Component, ChangeDetectionStrategy, Input, ViewEncapsulation} from '@ang @Component({ moduleId: module.id, selector: 'mat-progress-bar', + exportAs: 'matProgressBar', host: { 'role': 'progressbar', 'aria-valuemin': '0', diff --git a/src/lib/progress-spinner/progress-spinner.ts b/src/lib/progress-spinner/progress-spinner.ts index 56b4f1e872f8..5bf92bee427e 100644 --- a/src/lib/progress-spinner/progress-spinner.ts +++ b/src/lib/progress-spinner/progress-spinner.ts @@ -69,6 +69,7 @@ export const _MatProgressSpinnerMixinBase = mixinColor(MatProgressSpinnerBase, ' @Component({ moduleId: module.id, selector: 'mat-progress-spinner', + exportAs: 'matProgressSpinner', host: { 'role': 'progressbar', 'class': 'mat-progress-spinner', diff --git a/src/lib/radio/radio.ts b/src/lib/radio/radio.ts index 530c77f85a0b..14fc0397ef4d 100644 --- a/src/lib/radio/radio.ts +++ b/src/lib/radio/radio.ts @@ -75,6 +75,7 @@ export const _MatRadioGroupMixinBase = mixinDisabled(MatRadioGroupBase); */ @Directive({ selector: 'mat-radio-group', + exportAs: 'matRadioGroup', providers: [MAT_RADIO_GROUP_CONTROL_VALUE_ACCESSOR], host: { 'role': 'radiogroup', @@ -331,6 +332,7 @@ export const _MatRadioButtonMixinBase = inputs: ['color', 'disableRipple'], encapsulation: ViewEncapsulation.None, preserveWhitespaces: false, + exportAs: 'matRadioButton', host: { 'class': 'mat-radio-button', '[class.mat-radio-checked]': 'checked', diff --git a/src/lib/select/select.ts b/src/lib/select/select.ts index 7869b73dc543..e31bc5746924 100644 --- a/src/lib/select/select.ts +++ b/src/lib/select/select.ts @@ -146,6 +146,7 @@ export class MatSelectTrigger {} @Component({ moduleId: module.id, selector: 'mat-select', + exportAs: 'matSelect', templateUrl: 'select.html', styleUrls: ['select.css'], inputs: ['disabled', 'tabIndex'], @@ -177,7 +178,6 @@ export class MatSelectTrigger {} fadeInContent ], providers: [{provide: MatFormFieldControl, useExisting: MatSelect}], - exportAs: 'matSelect', }) export class MatSelect extends _MatSelectMixinBase implements AfterContentInit, OnDestroy, OnInit, ControlValueAccessor, CanDisable, HasTabIndex, MatFormFieldControl { diff --git a/src/lib/sidenav/drawer.ts b/src/lib/sidenav/drawer.ts index 9cf024098eb5..369060075523 100644 --- a/src/lib/sidenav/drawer.ts +++ b/src/lib/sidenav/drawer.ts @@ -100,6 +100,7 @@ export class MatDrawerContent implements AfterContentInit { @Component({ moduleId: module.id, selector: 'mat-drawer', + exportAs: 'matDrawer', template: '', animations: [ trigger('transform', [ @@ -359,6 +360,7 @@ export class MatDrawer implements AfterContentInit, OnDestroy { @Component({ moduleId: module.id, selector: 'mat-drawer-container', + exportAs: 'matDrawerContainer', templateUrl: 'drawer-container.html', styleUrls: [ 'drawer.css', diff --git a/src/lib/sidenav/sidenav.ts b/src/lib/sidenav/sidenav.ts index 3a7e6bdacf18..2e35eea33240 100644 --- a/src/lib/sidenav/sidenav.ts +++ b/src/lib/sidenav/sidenav.ts @@ -42,6 +42,7 @@ export class MatSidenavContent extends MatDrawerContent { @Component({ moduleId: module.id, selector: 'mat-sidenav', + exportAs: 'matSidenav', template: '', animations: [ trigger('transform', [ @@ -108,6 +109,7 @@ export class MatSidenav extends MatDrawer { @Component({ moduleId: module.id, selector: 'mat-sidenav-container', + exportAs: 'matSidenavContainer', templateUrl: 'sidenav-container.html', styleUrls: [ 'drawer.css', diff --git a/src/lib/slider/slider.ts b/src/lib/slider/slider.ts index e3d2a838327a..c28d07974ca2 100644 --- a/src/lib/slider/slider.ts +++ b/src/lib/slider/slider.ts @@ -94,6 +94,7 @@ export const _MatSliderMixinBase = mixinColor(mixinDisabled(MatSliderBase), 'acc @Component({ moduleId: module.id, selector: 'mat-slider', + exportAs: 'matSlider', providers: [MAT_SLIDER_VALUE_ACCESSOR], host: { '(focus)': '_onFocus()', diff --git a/src/lib/stepper/stepper.ts b/src/lib/stepper/stepper.ts index 120e6dad7923..b7cf7d55d660 100644 --- a/src/lib/stepper/stepper.ts +++ b/src/lib/stepper/stepper.ts @@ -42,6 +42,7 @@ export const _MatStepper = CdkStepper; templateUrl: 'step.html', providers: [{provide: MAT_ERROR_GLOBAL_OPTIONS, useExisting: MatStep}], encapsulation: ViewEncapsulation.None, + exportAs: 'matStep', preserveWhitespaces: false, }) export class MatStep extends _MatStep implements ErrorOptions { @@ -89,6 +90,7 @@ export class MatStepper extends _MatStepper { @Component({ moduleId: module.id, selector: 'mat-horizontal-stepper', + exportAs: 'matHorizontalStepper', templateUrl: 'stepper-horizontal.html', styleUrls: ['stepper.css'], inputs: ['selectedIndex'], @@ -114,6 +116,7 @@ export class MatHorizontalStepper extends MatStepper { } @Component({ moduleId: module.id, selector: 'mat-vertical-stepper', + exportAs: 'matVerticalStepper', templateUrl: 'stepper-vertical.html', styleUrls: ['stepper.css'], inputs: ['selectedIndex'], diff --git a/src/lib/table/row.ts b/src/lib/table/row.ts index 6fb1b2bbd7ed..b7ade94265c0 100644 --- a/src/lib/table/row.ts +++ b/src/lib/table/row.ts @@ -54,6 +54,7 @@ export class MatRowDef extends _MatCdkRowDef { } }, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, + exportAs: 'matHeaderRow', preserveWhitespaces: false, }) export class MatHeaderRow extends _MatHeaderRow { } @@ -69,6 +70,7 @@ export class MatHeaderRow extends _MatHeaderRow { } }, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, + exportAs: 'matRow', preserveWhitespaces: false, }) export class MatRow extends _MatRow { } diff --git a/src/lib/table/table.ts b/src/lib/table/table.ts index 97f936f1046c..70d4a2892d29 100644 --- a/src/lib/table/table.ts +++ b/src/lib/table/table.ts @@ -18,6 +18,7 @@ export const _MatTable = CdkTable; @Component({ moduleId: module.id, selector: 'mat-table', + exportAs: 'matTable', template: CDK_TABLE_TEMPLATE, styleUrls: ['table.css'], host: { diff --git a/src/lib/tabs/tab-group.ts b/src/lib/tabs/tab-group.ts index 0d232cc2b3ed..a06d80c0e4cb 100644 --- a/src/lib/tabs/tab-group.ts +++ b/src/lib/tabs/tab-group.ts @@ -64,6 +64,7 @@ export const _MatTabGroupMixinBase = mixinColor(mixinDisableRipple(MatTabGroupBa @Component({ moduleId: module.id, selector: 'mat-tab-group', + exportAs: 'matTabGroup', templateUrl: 'tab-group.html', styleUrls: ['tab-group.css'], encapsulation: ViewEncapsulation.None, diff --git a/src/lib/tabs/tab-nav-bar/tab-nav-bar.ts b/src/lib/tabs/tab-nav-bar/tab-nav-bar.ts index 8ab3170ce8cd..46a48218f0f6 100644 --- a/src/lib/tabs/tab-nav-bar/tab-nav-bar.ts +++ b/src/lib/tabs/tab-nav-bar/tab-nav-bar.ts @@ -63,6 +63,7 @@ export const _MatTabNavMixinBase = mixinDisableRipple(mixinColor(MatTabNavBase, @Component({ moduleId: module.id, selector: '[mat-tab-nav-bar]', + exportAs: 'matTabNavBar, matTabNav', inputs: ['color', 'disableRipple'], templateUrl: 'tab-nav-bar.html', styleUrls: ['tab-nav-bar.css'], @@ -181,6 +182,7 @@ export const _MatTabLinkMixinBase = mixinDisabled(MatTabLinkBase); */ @Directive({ selector: '[mat-tab-link], [matTabLink]', + exportAs: 'matTabLink', inputs: ['disabled'], host: { 'class': 'mat-tab-link', diff --git a/src/lib/toolbar/toolbar.ts b/src/lib/toolbar/toolbar.ts index b27331206107..607f2c0bf02d 100644 --- a/src/lib/toolbar/toolbar.ts +++ b/src/lib/toolbar/toolbar.ts @@ -19,6 +19,7 @@ import {CanColor, mixinColor} from '@angular/material/core'; @Directive({ selector: 'mat-toolbar-row', + exportAs: 'matToolbarRow', host: {'class': 'mat-toolbar-row'}, }) export class MatToolbarRow {} @@ -34,6 +35,7 @@ export const _MatToolbarMixinBase = mixinColor(MatToolbarBase); @Component({ moduleId: module.id, selector: 'mat-toolbar', + exportAs: 'matToolbar', templateUrl: 'toolbar.html', styleUrls: ['toolbar.css'], inputs: ['color'], diff --git a/src/lib/tooltip/tooltip.ts b/src/lib/tooltip/tooltip.ts index 4c54b6b9cce5..c4850668aecd 100644 --- a/src/lib/tooltip/tooltip.ts +++ b/src/lib/tooltip/tooltip.ts @@ -84,6 +84,7 @@ export const MAT_TOOLTIP_SCROLL_STRATEGY_PROVIDER = { */ @Directive({ selector: '[mat-tooltip], [matTooltip]', + exportAs: 'matTooltip', host: { '(longpress)': 'show()', '(focus)': 'show()', @@ -91,7 +92,6 @@ export const MAT_TOOLTIP_SCROLL_STRATEGY_PROVIDER = { '(keydown)': '_handleKeydown($event)', '(touchend)': 'hide(' + TOUCHEND_HIDE_DELAY + ')', }, - exportAs: 'matTooltip', }) export class MatTooltip implements OnDestroy { _overlayRef: OverlayRef | null;