feat(navbarStyle): set navbar color by config/attr

This commit is contained in:
Adam Bradley
2015-11-05 22:51:30 -06:00
parent 246fd977f2
commit f04181d468
3 changed files with 30 additions and 15 deletions

View File

@ -1,4 +1,4 @@
import {AppViewManager, ElementRef, Directive} from 'angular2/angular2';
import {AppViewManager, ElementRef, Directive, Renderer} from 'angular2/angular2';
import {IonicApp} from './app';
@ -47,3 +47,15 @@ export class IdRef {
this.app.unregister(this.id);
}
}
@Directive({
selector: '[attr]',
inputs: ['attr']
})
export class Attr {
constructor(private renderer: Renderer, private elementRef: ElementRef) {}
onInit() {
this.renderer.setElementAttribute(this.elementRef, this.attr, '');
}
}

View File

@ -69,7 +69,8 @@ class BackButtonText extends Ion {
'[hidden]': '_hidden'
},
inputs: [
'hideBackButton'
'hideBackButton',
'navbarStyle'
],
directives: [BackButton, BackButtonText, Icon]
})
@ -82,9 +83,16 @@ export class Navbar extends ToolbarBase {
renderer: Renderer
) {
super(elementRef, config);
this.app = app;
this.renderer = renderer;
renderer.setElementClass(elementRef, 'toolbar', true);
this.app = app;
let navbarStyle = config.get('navbarStyle');
if (navbarStyle) {
renderer.setElementAttribute(elementRef, navbarStyle, '');
}
viewCtrl && viewCtrl.setNavbar(this);
this.bbIcon = config.get('backButtonIcon');
@ -92,10 +100,15 @@ export class Navbar extends ToolbarBase {
}
onInit() {
super.onInit();
let hideBackButton = this.hideBackButton;
if (typeof hideBackButton === 'string') {
this.hideBackButton = (hideBackButton === '' || hideBackButton === 'true');
}
if (this.navbarStyle) {
this.renderer.setElementAttribute(this.elementRef, this.navbarStyle, '');
}
}
getBackButtonRef() {

View File

@ -1,24 +1,14 @@
import {Directive, ElementRef, Optional, Host, NgFor, NgIf, forwardRef, ViewContainerRef, Renderer} from 'angular2/angular2';
import {Directive, ElementRef, Optional, Host, NgFor, NgIf, forwardRef, ViewContainerRef} from 'angular2/angular2';
import {Ion} from '../ion';
import {IonicApp} from '../app/app';
import {Attr} from '../app/id';
import {Config} from '../../config/config';
import {ViewController} from '../nav/view-controller';
import {ConfigComponent} from '../../config/decorators';
import {Icon} from '../icon/icon';
@Directive({
selector: '[attr]',
inputs: ['attr']
})
class Attr {
constructor(private renderer: Renderer, private elementRef: ElementRef) {}
onInit() {
this.renderer.setElementAttribute(this.elementRef, this.attr, '');
}
}
/**
* _For basic Tabs usage, see the [Tabs section](../../../../components/#tabs)
* of the Component docs._