Skip to content

Commit ef087ed

Browse files
author
高宇桥
committed
修改项目结构
1 parent d6c2afa commit ef087ed

35 files changed

Lines changed: 2507 additions & 281 deletions

package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -128,7 +128,8 @@
128128
"webpack-dev-middleware": "^1.6.1",
129129
"webpack-dev-server": "^2.1.0-beta.9",
130130
"webpack-md5-hash": "^0.0.5",
131-
"webpack-merge": "^0.15.0"
131+
"webpack-merge": "^0.15.0",
132+
"weui": "^1.0.2"
132133
},
133134
"repository": {
134135
"type": "git",

src/app/Components/Tab/index.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export * from './tab.component';
Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
2+
<div class="page">
3+
<div class="page__bd" style="height: 100%;">
4+
<div class="weui-tab">
5+
<div class="weui-tab__panel">
6+
7+
</div>
8+
<div class="weui-tabbar" >
9+
<a href="javascript:;"
10+
*ngFor="let item of items"
11+
(click)="tabChange(item,$event)"
12+
[ngClass]="setClass(item)" >
13+
<img
14+
src="{{item === selectedItem ? item.activeSrc : item.src}}"
15+
alt=""
16+
class="weui-tabbar__icon">
17+
<p class="weui-tabbar__label">{{item.text}}</p>
18+
</a>
19+
</div>
20+
</div>
21+
</div>
22+
</div>
Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
import { Component ,Input,Output,EventEmitter } from '@angular/core';
2+
3+
import { AppState } from '../../app.service';
4+
5+
6+
@Component({
7+
selector: 'tab',
8+
9+
templateUrl: './tab.component.html'
10+
})
11+
export class TabComponent {
12+
@Input() items:String[];
13+
@Output() tabTap:EventEmitter<any> = new EventEmitter();
14+
15+
selectedItem : Object;
16+
17+
constructor(public appState: AppState) {
18+
19+
}
20+
21+
ngOnInit() {
22+
this.selectedItem = this.items[0];
23+
}
24+
tabChange(item:Object,event:Object){
25+
this.selectedItem = item;
26+
27+
console.log(this.tabTap);
28+
this.tabTap.emit(null);
29+
}
30+
setClass(item){
31+
return {
32+
'weui-tabbar__item':true,
33+
'weui-bar__item_on': item === this.selectedItem
34+
}
35+
}
36+
}

src/app/Model/product.model.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
export class Product{
2+
id:number;
3+
name:string;
4+
count:number;
5+
}

src/app/Services/order.service.ts

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import { Injectable } from '@angular/core';
2+
import { Headers, Http } from '@angular/http';
3+
import 'rxjs/add/operator/toPromise';
4+
import { Product } from '../Model/product.model';
5+
6+
@Injectable()
7+
export class ProductService{
8+
private url = 'http://localhost:3001/app';
9+
10+
constructor(private http: Http){}
11+
12+
getProduct(): Promise<Product[]>{
13+
return this.http.get(this.url)
14+
.toPromise()
15+
.then(response => response.json().data as Product[])
16+
.catch(this.handleError);
17+
}
18+
19+
20+
private handleError(error: any): Promise<any> {
21+
console.error('An error occurred', error); // for demo purposes only
22+
return Promise.reject(error.message || error);
23+
}
24+
}
Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
import { Component,ElementRef } from '@angular/core';
2+
3+
import { AppState } from '../../app.service';
4+
import { Title } from './title';
5+
import { XLarge } from './x-large';
6+
import { TabComponent } from '../../Components/Tab';
7+
8+
@Component({
9+
// The selector is what angular internally uses
10+
// for `document.querySelectorAll(selector)` in our index.html
11+
// where, in this case, selector is the string 'home'
12+
selector: 'home', // <home></home>
13+
// We need to tell Angular's Dependency Injection which providers are in our app.
14+
providers: [
15+
Title
16+
],
17+
18+
// Every Angular template is first compiled by the browser before Angular runs it's compiler
19+
template: `<tab [items]="items" (tabTap)="tap($event)"></tab>`
20+
})
21+
22+
23+
24+
export class HomeComponent {
25+
// TypeScript public modifiers
26+
constructor(private _element: ElementRef) {
27+
28+
}
29+
items : Object[];
30+
31+
tap(e:Object){
32+
this._element.nativeElement.querySelector('.weui-tab__panel').innerHTML= '<div>111</div>'
33+
}
34+
35+
ngOnInit() {
36+
this.items = [{
37+
src:'./assets/img/sc.png',
38+
activeSrc:'./assets/img/sca.png',
39+
text:'行程'
40+
},{
41+
src:'./assets/img/my.png',
42+
activeSrc:'./assets/img/mya.png',
43+
text:'我的'
44+
}]
45+
}
46+
47+
}

0 commit comments

Comments
 (0)