feat(chips): added Chip component

This commit is contained in:
Lee Nathan
2016-08-11 14:26:55 -07:00
committed by Brandy Carney
parent 57eda7f602
commit 421f637f96
2 changed files with 58 additions and 0 deletions

View File

@@ -0,0 +1,55 @@
import { Directive, ElementRef, Renderer, Attribute } from '@angular/core';
import { Config } from '../../config/config';
/**
* @name Chip
* @module ionic
* @description
* Chips represent complex entities in small blocks, such as a contact.
* @see {@link /docs/v2/components/#chips Chips Component Docs}
**/
@Directive({
selector: 'ion-chip'
})
export class Chip {
constructor(
config: Config,
private _elementRef: ElementRef,
private _renderer: Renderer
) {
let element = _elementRef.nativeElement;
this._readAttrs(element);
}
/**
* @private
*/
private _readAttrs(element: HTMLElement) {
let elementAttrs = element.attributes;
let attrName: string;
console.info("mushroom");
for (let i = 0, l = elementAttrs.length; i < l; i++) {
if (elementAttrs[i].value !== '') continue;
attrName = elementAttrs[i].name;
// Ignore attributes item-left, item-right
if (attrName.indexOf('item') === -1) {
this._setClass(attrName);
}
}
}
/**
* @private
*/
private _setClass(color: string) {
this._renderer.setElementClass(this._elementRef.nativeElement, 'chip-' + color, true);
}
}

View File

@@ -46,6 +46,7 @@ import { NavPush } from '../components/nav/nav-push';
import { NavbarTemplate, Navbar } from '../components/navbar/navbar';
import { ShowWhen, HideWhen } from '../components/show-hide-when/show-hide-when';
import { Typography } from '../components/typography/typography';
import { Chip } from '../components/chip/chip';
/**
* @private
@@ -67,6 +68,7 @@ import { Typography } from '../components/typography/typography';
* - MenuClose
* - Badge
* - Button
* - Chip
* - Content
* - Scroll
* - InfiniteScroll
@@ -131,6 +133,7 @@ export const IONIC_DIRECTIVES: any[] = [
Backdrop,
Badge,
Button,
Chip,
Content,
Scroll,
InfiniteScroll,