my-lib/nav-bar/nav-bar.ts
encapsulation | ViewEncapsulation.None |
selector | nav-bar |
styleUrls | nav-bar.less, |
templateUrl | ./nav-bar.html |
Properties |
Methods |
Inputs |
HostBindings |
Accessors |
constructor()
|
Defined in my-lib/nav-bar/nav-bar.ts:30
|
class
|
Type:
Default value: |
Defined in my-lib/nav-bar/nav-bar.ts:18
|
light
|
Type: |
Defined in my-lib/nav-bar/nav-bar.ts:28
|
class |
class:
|
Defined in my-lib/nav-bar/nav-bar.ts:23
|
ngOnInit |
ngOnInit()
|
Defined in my-lib/nav-bar/nav-bar.ts:34
|
Returns :
void
|
_classObj |
_classObj:
|
Type : Object
|
Default value : {
[`${navbarPrefixCls}`]: true
}
|
Defined in my-lib/nav-bar/nav-bar.ts:19
|
left |
left:
|
Type : TemplateRef<any>
|
Decorators : ContentChild
|
Defined in my-lib/nav-bar/nav-bar.ts:15
|
navbarPrefixCls |
navbarPrefixCls:
|
Type : string
|
Default value : navbarPrefixCls
|
Defined in my-lib/nav-bar/nav-bar.ts:14
|
right |
right:
|
Type : TemplateRef<any>
|
Decorators : ContentChild
|
Defined in my-lib/nav-bar/nav-bar.ts:16
|
light |
setlight(val: any)
|
Defined in my-lib/nav-bar/nav-bar.ts:28
|
import {
Component, OnInit, ViewEncapsulation,
HostBinding, Input, ContentChild, TemplateRef
} from '@angular/core';
import { navbarPrefixCls } from './val';
import { ansycClassObj, merge, setClassObj, isMeepoTrue } from 'meepo-utils';
@Component({
selector: 'nav-bar',
templateUrl: './nav-bar.html',
styleUrls: ['./nav-bar.less', './patch.less'],
encapsulation: ViewEncapsulation.None
})
export class NavBarComponent implements OnInit {
navbarPrefixCls: string = navbarPrefixCls;
@ContentChild('left') left: TemplateRef<any>;
@ContentChild('right') right: TemplateRef<any>;
@Input() class: string = '';
_classObj: Object = {
[`${navbarPrefixCls}`]: true
};
@HostBinding('class')
get navBarClass() {
return ansycClassObj(this._classObj);
}
@Input()
set light(val: any) {
this._classObj[`${navbarPrefixCls}-light`] = isMeepoTrue(val);
}
constructor() { }
ngOnInit() { }
}
<div class="{{navbarPrefixCls}}-left" role="button">
<ng-container *ngTemplateOutlet="left"></ng-container>
</div>
<div class="am-navbar-title">
<ng-content></ng-content>
</div>
<div class="am-navbar-right" role="button">
<ng-container *ngTemplateOutlet="right"></ng-container>
</div>