Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 12 additions & 2 deletions src/lib/menu/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
import {NgModule} from '@angular/core';
import {CommonModule} from '@angular/common';
import {OverlayModule, MdCommonModule} from '../core';
import {MdMenu} from './menu-directive';
import {MdMenu, MD_MENU_DEFAULT_OPTIONS} from './menu-directive';
import {MdMenuItem} from './menu-item';
import {MdMenuTrigger, MD_MENU_SCROLL_STRATEGY_PROVIDER} from './menu-trigger';
import {MdRippleModule} from '../core/ripple/index';
Expand All @@ -24,7 +24,17 @@ import {MdRippleModule} from '../core/ripple/index';
],
exports: [MdMenu, MdMenuItem, MdMenuTrigger, MdCommonModule],
declarations: [MdMenu, MdMenuItem, MdMenuTrigger],
providers: [MD_MENU_SCROLL_STRATEGY_PROVIDER],
providers: [
MD_MENU_SCROLL_STRATEGY_PROVIDER,
{
provide: MD_MENU_DEFAULT_OPTIONS,
useValue: {
overlapTrigger: true,
xPosition: 'after',
yPosition: 'below',
},
}
],
})
export class MdMenuModule {}

Expand Down
22 changes: 18 additions & 4 deletions src/lib/menu/menu-directive.ts
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,8 @@ import {
ViewEncapsulation,
ElementRef,
ChangeDetectionStrategy,
InjectionToken,
Inject,
} from '@angular/core';
import {AnimationEvent} from '@angular/animations';
import {MenuPositionX, MenuPositionY} from './menu-positions';
Expand All @@ -34,6 +36,16 @@ import {merge} from 'rxjs/observable/merge';
import {Observable} from 'rxjs/Observable';
import {Direction} from '../core';

/** Default `md-menu` options that can be overridden. */
export interface MdMenuDefaultOptions {
xPosition: MenuPositionX;
yPosition: MenuPositionY;
overlapTrigger: boolean;
}

/** Injection token to be used to override the default options for `md-menu`. */
export const MD_MENU_DEFAULT_OPTIONS =
new InjectionToken<MdMenuDefaultOptions>('md-menu-default-options');

@Component({
moduleId: module.id,
Expand All @@ -50,8 +62,8 @@ import {Direction} from '../core';
})
export class MdMenu implements AfterContentInit, MdMenuPanel, OnDestroy {
private _keyManager: FocusKeyManager;
private _xPosition: MenuPositionX = 'after';
private _yPosition: MenuPositionY = 'below';
private _xPosition: MenuPositionX = this._defaultOptions.xPosition;
private _yPosition: MenuPositionY = this._defaultOptions.yPosition;

/** Subscription to tab events on the menu panel */
private _tabSubscription: Subscription;
Expand Down Expand Up @@ -96,7 +108,7 @@ export class MdMenu implements AfterContentInit, MdMenuPanel, OnDestroy {
@ContentChildren(MdMenuItem) items: QueryList<MdMenuItem>;

/** Whether the menu should overlap its trigger. */
@Input() overlapTrigger = true;
@Input() overlapTrigger = this._defaultOptions.overlapTrigger;

/**
* This method takes classes set on the host md-menu element and applies them on the
Expand All @@ -120,7 +132,9 @@ export class MdMenu implements AfterContentInit, MdMenuPanel, OnDestroy {
/** Event emitted when the menu is closed. */
@Output() close = new EventEmitter<void | 'click' | 'keydown'>();

constructor(private _elementRef: ElementRef) { }
constructor(
private _elementRef: ElementRef,
@Inject(MD_MENU_DEFAULT_OPTIONS) private _defaultOptions: MdMenuDefaultOptions) { }

ngAfterContentInit() {
this._keyManager = new FocusKeyManager(this.items).withWrap();
Expand Down
24 changes: 24 additions & 0 deletions src/lib/menu/menu.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,7 @@ import {
MenuPositionX,
MenuPositionY,
MdMenu,
MD_MENU_DEFAULT_OPTIONS,
} from './index';
import {MENU_PANEL_TOP_PADDING} from './menu-trigger';
import {extendObject} from '../core/util/object-extend';
Expand Down Expand Up @@ -875,6 +876,29 @@ describe('MdMenu', () => {

});

describe('MdMenu default overrides', () => {
beforeEach(async(() => {
TestBed.configureTestingModule({
imports: [MdMenuModule, NoopAnimationsModule],
declarations: [SimpleMenu],
providers: [{
provide: MD_MENU_DEFAULT_OPTIONS,
useValue: {overlapTrigger: false, xPosition: 'before', yPosition: 'above'},
}],
}).compileComponents();
}));

it('should allow for the default menu options to be overridden', () => {
const fixture = TestBed.createComponent(SimpleMenu);
fixture.detectChanges();
const menu = fixture.componentInstance.menu;

expect(menu.overlapTrigger).toBe(false);
expect(menu.xPosition).toBe('before');
expect(menu.yPosition).toBe('above');
});
});

@Component({
template: `
<button [mdMenuTriggerFor]="menu" #triggerEl>Toggle menu</button>
Expand Down
2 changes: 1 addition & 1 deletion src/lib/menu/menu.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
* found in the LICENSE file at https://angular.io/license
*/

export {MdMenu} from './menu-directive';
export {MdMenu, MdMenuDefaultOptions, MD_MENU_DEFAULT_OPTIONS} from './menu-directive';
export {MdMenuItem} from './menu-item';
export {MdMenuTrigger} from './menu-trigger';
export {MdMenuPanel} from './menu-panel';
Expand Down