fix(module: grid): change API OnClick to onClick (#394)

components/grid/demo/basic.ts

@@ -4,24 +4,24 @@ import { Component } from '@angular/core';
   selector: 'demo-grid-basic',
   template: `
     <div class="sub-title">Always square grid item </div>
-    <Grid [activeStyle]="false" [data]="data" (OnClick)="click($event)"></Grid>
+    <Grid [activeStyle]="false" [data]="data" (onClick)="click($event)"></Grid>
     <br>
-    <Grid [activeStyle]="false" [data]="dataList" (OnClick)="click($event)"></Grid>
+    <Grid [activeStyle]="false" [data]="dataList" (onClick)="click($event)"></Grid>
     <br>
     <div class="sub-title">Grid item adjust accroiding to img size </div>
-    <Grid class="not-square-grid" [data]="data" [square]="false" (OnClick)="click($event)"></Grid>
+    <Grid class="not-square-grid" [data]="data" [square]="false" (onClick)="click($event)"></Grid>
     <br>
     <div class="sub-title">ColumnNum=3 </div>
-    <Grid [data]="data" [columnNum]="3" (OnClick)="click($event)"></Grid>
+    <Grid [data]="data" [columnNum]="3" (onClick)="click($event)"></Grid>
     <br>
     <div class="sub-title">No border </div>
-    <Grid [data]="data" [hasLine]="false" (OnClick)="click($event)"></Grid>
+    <Grid [data]="data" [hasLine]="false" (onClick)="click($event)"></Grid>
     <br>
     <div class="sub-title">Carousel</div>
-    <Grid [data]="data" [isCarousel]="true" (OnClick)="click($event)"></Grid>
+    <Grid [data]="data" [isCarousel]="true" (onClick)="click($event)"></Grid>
     <br>
     <div class="sub-title">Custom content</div>
-    <Grid [data]="data" [columnNum]="3" [itemStyle]="{ height: '150px', background: 'rgba(0,0,0,.05)' }" (OnClick)="click($event)"></Grid>
+    <Grid [data]="data" [columnNum]="3" [itemStyle]="{ height: '150px', background: 'rgba(0,0,0,.05)' }" (onClick)="click($event)"></Grid>
     <br>
     <div class="sub-title">ng-content</div>
     <Grid>

components/grid/doc/index.en-US.md

@@ -15,7 +15,7 @@ We divided the design area into a number of aliquots in horizontal and vertical.
 Properties | Description | Type | Default
 -----------|------------|------|--------
 | data    |    data record array to be rendered     | `Array<{icon, text}>`  | [] |
-| OnClick    |   Handler to be called when the user taps the grid   | (el: Object, index: number): void  | - |
+| onClick    |   Handler to be called when the user taps the grid   | (el: Object, index: number): void  | - |
 | columnNum    |   the number of columns   | number  |  `4` |
 | hasLine    |   whether to show border    | boolean  |  `true` |
 | isCarousel    |   whether to be played as a Carousel    | boolean  | `false` |

components/grid/doc/index.zh-CN.md

@@ -16,7 +16,7 @@ subtitle: 宫格
 属性 | 说明 | 类型 | 默认值
 ----|-----|------|------
 | data    |    传入的菜单数据     | `Array<{icon, text}>`  | [] |
-| OnClick    |   点击每个菜单的回调函数   | (el: Object, index: number): void  | - |
+| onClick    |   点击每个菜单的回调函数   | (el: Object, index: number): void  | - |
 | columnNum    |   列数     | number  |  `4` |
 | hasLine    |   是否有边框     | boolean  |  `true` |
 | isCarousel    |   是否跑马灯,     | boolean  | `false` |

components/grid/grid.component.spec.ts

@@ -60,16 +60,16 @@ describe('GridComponent', () => {
     );
   });
 
-  it('OnClick work', () => {
+  it('onClick work', () => {
     component.data = Array.from(new Array(9)).map((val, i) => ({
       icon: 'https://gw.alipayobjects.com/zos/rmsportal/nywPmnTAvTmLusPxHPSu.png',
       text: `name${i}`
     }));
     fixture.detectChanges();
-    component.OnClick = jasmine.createSpy('OnClick is callback');
+    component.onClick = jasmine.createSpy('onClick is callback');
     gridEle.nativeElement.querySelector('.am-grid-item-content').click();
     fixture.detectChanges();
-    expect(component.OnClick).toHaveBeenCalledTimes(1);
+    expect(component.onClick).toHaveBeenCalledTimes(1);
   });
 
   it('should create', () => {
@@ -85,9 +85,9 @@ describe('GridComponent', () => {
           [hasLine]="hasLine"
           [columnNum]="columnNum"
           [isCarousel]="isCarousel"
-          (OnClick)="OnClick($event)"
+          (onClick)="onClick($event)"
     ></Grid>
-    <Grid [activeStyle]="false" [data]="dataList" (OnClick)="click($event)"></Grid>
+    <Grid [activeStyle]="false" [data]="dataList" (onClick)="click($event)"></Grid>
   `
 })
 export class TestGridComponent {
@@ -105,7 +105,7 @@ export class TestGridComponent {
     text: `name${i}`
   }));
 
-  OnClick(event) {
+  onClick(event) {
     console.log(event);
   }
 }

components/grid/grid.component.ts

@@ -53,7 +53,7 @@ export class GridComponent implements OnInit {
     this.init();
   }
   @Output()
-  OnClick: EventEmitter<any> = new EventEmitter();
+  onClick: EventEmitter<any> = new EventEmitter();
 
   @HostBinding('class.am-grid')
   amGrid: boolean = true;
@@ -151,7 +151,7 @@ export class GridComponent implements OnInit {
       data: data,
       index: index
     };
-    this.OnClick.emit(outputData);
+    this.onClick.emit(outputData);
   }
 
   ngOnInit() {

components/notice-bar/notice-bar.component.spec.ts

@@ -44,9 +44,9 @@ describe('NoticeBarComponent', () => {
     );
   });
 
-  it('OnClick work', () => {
+  it('onClick work', () => {
     fixture.detectChanges();
-    component.onClick = jasmine.createSpy('OnClick is callback');
+    component.onClick = jasmine.createSpy('onClick is callback');
     noticeBarEle.nativeElement.querySelector('.am-notice-bar').click();
     fixture.detectChanges();
     expect(component.onClick).toHaveBeenCalledTimes(1);