mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-18 19:21:34 +08:00
feat(navbarStyle): set navbar color by config/attr
This commit is contained in:
@ -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, '');
|
||||
}
|
||||
}
|
||||
|
@ -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() {
|
||||
|
@ -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._
|
||||
|
Reference in New Issue
Block a user