Skip to content

Commit ef087ed

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

35 files changed

+2507
-281
lines changed

‎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';

‎src/app/Components/Tab/tab.component.html

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>

‎src/app/Components/Tab/tab.component.ts

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+
}

‎src/app/+detail/detail.component.ts renamed to ‎src/app/View/+detail/detail.component.ts

File renamed without changes.

‎src/app/+detail/index.ts renamed to ‎src/app/View/+detail/index.ts

File renamed without changes.

‎src/app/home/home.component.spec.ts renamed to ‎src/app/View/home/home.component.spec.ts

File renamed without changes.

‎src/app/View/home/home.component.ts

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)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy