jeneser / hpunews Goto Github PK
View Code? Open in Web Editor NEWAn awesome news app for hpu.
License: MIT License
An awesome news app for hpu.
License: MIT License
功能实现:
实现滑动Tabs
slideTo Runtime Error Cannot read property 'length' of undefined and ion-tabs tabs.getSelected().index got a Error: Cannot read property 'index' of null
已经提交issue到ionic官方仓库,以下是bug重现:
http://plnkr.co/edit/BAy0Z7?p=preview
@angular/router UNMET PEER DEPENDENCY
要用router,装过之后发现不能用,npm的log:
hpunews@ /home/jeneser/workspace/hpunews
├── UNMET PEER DEPENDENCY @angular/[email protected]
├── UNMET PEER DEPENDENCY @angular/[email protected]
├── UNMET PEER DEPENDENCY @angular/[email protected]
├── @angular/[email protected]
└── UNMET PEER DEPENDENCY [email protected]
这种情况下,编译会失败,谷歌了一圈很多说需要是@angular/[email protected],重装试试...
hpunews@ /home/jeneser/workspace/hpunews
├── @angular/[email protected]
└── UNMET PEER DEPENDENCY [email protected]
的确是少了很多,与angular的核心组件倒是比配了,but,rxjs说要依赖beta.12,那好,装一下...
hpunews@ /home/jeneser/workspace/hpunews
├─┬ [email protected]
│ └── [email protected]
└── UNMET PEER DEPENDENCY [email protected]
编译:
> hpunews@ build /home/jeneser/workspace/hpunews
> ionic-app-scripts build
[14:54:43] ionic-app-scripts 1.1.0
[14:54:43] build dev started ...
[14:54:43] clean started ...
[14:54:43] clean finished in 96 ms
[14:54:43] copy started ...
[14:54:43] transpile started ...
[14:54:49] typescript: node_modules/@angular/router/src/common_router_providers.d.ts, line: 9
Module '"/home/jeneser/workspace/hpunews/node_modules/@angular/core/index"' has no exported member
'ComponentResolver'.
L8: export declare const ROUTER_OPTIONS: OpaqueToken;
L10: * @experimental
[14:54:49] typescript: node_modules/@angular/router/src/config.d.ts, line: 256
Generic type 'Type<T>' requires 1 type argument(s).
L255: resolve?: ResolveData;
L256: children?: Route[];
[14:54:49] typescript: node_modules/@angular/router/src/router.d.ts, line: 16
Module '"/home/jeneser/workspace/hpunews/node_modules/@angular/core/index"' has no exported member
'ComponentResolver'.
L15: import { UrlSerializer, UrlTree } from './url_tree';
L16: export interface NavigationExtras {
L17: relativeTo?: ActivatedRoute;
[14:54:49] typescript: node_modules/@angular/router/src/router.d.ts, line: 114
Generic type 'Type<T>' requires 1 type argument(s).
L113: * Returns the current url.
L115: url: string;
[14:54:49] typescript: node_modules/@angular/router/src/router_state.d.ts, line: 37
Generic type 'Type<T>' requires 1 type argument(s).
L37: * ```
L38: * class MyComponent {
[14:54:49] typescript: node_modules/@angular/router/src/router_state.d.ts, line: 60
Generic type 'Type<T>' requires 1 type argument(s).
L60: * ### Usage
[14:54:49] typescript: node_modules/@angular/router/src/router_state.d.ts, line: 85
Generic type 'Type<T>' requires 1 type argument(s).
L84: * ### Usage
L86: * ```
[14:54:49] typescript: src/app/app-routing-module.ts, line: 2
Module '"/home/jeneser/workspace/hpunews/node_modules/@angular/router/index"' has no exported member
'RouterModule'.
L1: import { NgModule } from '@angular/core';
L2: import { RouterModule, Routes } from '@angular/router';
[14:54:49] typescript: src/app/app-routing-module.ts, line: 2
Module '"/home/jeneser/workspace/hpunews/node_modules/@angular/router/index"' has no exported member
'Routes'.
L1: import { NgModule } from '@angular/core';
L2: import { RouterModule, Routes } from '@angular/router';
[14:54:49] transpile failed
[14:54:49] ionic-app-script task: "build"
[14:54:49] Error: Error
npm ERR! Linux 4.4.0-62-generic
npm ERR! argv "/home/jeneser/Tools/nvm/versions/node/v6.9.2/bin/node" "/home/jeneser/Tools/nvm/versions/node/v6.9.2/bin/npm" "run" "build"
npm ERR! node v6.9.2
npm ERR! npm v3.10.9
npm ERR! code ELIFECYCLE
npm ERR! hpunews@ build: `ionic-app-scripts build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the hpunews@ build script 'ionic-app-scripts build'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the hpunews package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! ionic-app-scripts build
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs hpunews
npm ERR! Or if that isn't available, you can get their info via:
npm ERR! npm owner ls hpunews
npm ERR! There is likely additional logging output above.
npm ERR! Please include the following file with any support request:
npm ERR! /home/jeneser/workspace/hpunews/npm-debug.log
ionic-native又与它有问题,编译同样不会通过,泪崩......
ionic2提供的segment组件是不支持滑动的,需要自己实现.
以下是核心代码,
<ion-content (swipe)="swipeEvent($event)">
...
</ion-content>
export class HomePage {
catalogArray = ['rec', 'news', 'logistic', 'notice', 'job'];
catalog: string = this.catalogArray[0];
constructor(public navCtrl: NavController) {
}
swipeEvent(event) {
// 左滑
if (event.direction === 2) {
if (this.catalogArray.indexOf(this.catalog) < this.catalogArray.length - 1) {
this.catalog = this.catalogArray[this.catalogArray.indexOf(this.catalog) + 1];
}
}
// 右滑
if (event.direction === 4) {
if (this.catalogArray.indexOf(this.catalog) > 0) {
this.catalog = this.catalogArray[this.catalogArray.indexOf(this.catalog) - 1];
}
}
}
}
完整代码:ab1f553
滑动方向参考:
Name Value
DIRECTION_NONE 1
DIRECTION_LEFT 2
DIRECTION_RIGHT 4
DIRECTION_UP 8
DIRECTION_DOWN 16
DIRECTION_HORIZONTAL 6
DIRECTION_VERTICAL 24
DIRECTION_ALL 30
feat:Transparet status bar for android
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.