我正在尝试改变Ionic 2中的导航栏背景颜色.我尝试了很多东西,比如class ="bar bar-stable"等
现在我的代码看起来像这样:
<ion-navbar *navbar>
Run Code Online (Sandbox Code Playgroud)
所以背景当前是灰色的(默认)
我正在使用Ionic2开发应用程序,我正处于需要以不同大小预览应用程序的步骤中.目前我在所有大小,字体大小,填充等使用vw ...但是当调整字体大小有时变得有点小,甚至有时文本往往不可读; 为此,我想知道在这种情况下最好使用什么(px,%,vw,wh或em).
或者我还需要使用@media并支持不同的字体大小?
有什么想法吗?
我看过一些不同的帖子,关于无法找到本地文件来打开它们,无论它们是图像还是数据文件,但没有一个解决方案对我有用.我的猜测是有一些我缺少的配置.
我正在寻找的文件位于与我的app.html和app.ts文件相同级别的名为"data"的文件夹中.
这是我在app.html中的内容,PS我也在使用Ionic2:
<ion-menu (click)='getDepartments()' side='right' type='overlay' [content]="content">
Run Code Online (Sandbox Code Playgroud)
在app.ts文件中我有:
getDepartments() {
this.http.get('/data/data.json')
.map(res => res.json())
.subscribe(
data => this.departments = data,
err => console.log(err),
() => console.log('Random Quote Complete')
);
}
Run Code Online (Sandbox Code Playgroud)
我试过了:
./data/data.json
data/data.json
app/data/data.json
Run Code Online (Sandbox Code Playgroud)
和任何其他路径.并且它们都返回404文件未找到错误.这似乎就像熟悉Angular 2一样成长.先谢谢
我使用Ionic2框架在Angular2中使用Injectable Service时遇到问题.
我的服务如下:
import {Injectable} from '@angular/core';
import {NavController} from 'ionic-angular';
@Injectable()
export class ViewStackController {
static get parameters() {
return [[NavController]];
}
constructor(nav) {
}
}
Run Code Online (Sandbox Code Playgroud)
我得到错误No provider for NavController.这很奇怪,因为在任何Page类中它都有效,尽管它有@Component,但也许这就是问题所在.
编辑#1:
我正在提供这项服务ionicBootstrap,如下所示:
ionicBootstrap(MyApp, [ViewStackController], {});
Run Code Online (Sandbox Code Playgroud) 我刚刚安装了一个新的Ionic项目 - Ionic v2.0.0-beta.32
我想在新安装的主页上添加背景图片,有没有人可以告诉我我是怎么做到这一点的?所有我能找到的是Ionic 1的信息,事情似乎有很大的不同.
从我发现的,图像需要是以下的尺寸
2800px x 2800px
Run Code Online (Sandbox Code Playgroud)
但除此之外,我找不到任何其他教程.
这是我的第一个离子项目,所以要温柔
谢谢你们
我刚刚开始使用Yarn包管理器,我下载了一个启动Ionic 2项目.
在这个项目中,我们从编译,缩小,lint和捆绑代码的脚本中获得了很多帮助.所有这些都是由ionic-app-scripts提供的,它有几个依赖项,用于运行命令.
问题是当我使用Yarn进行安装时,node_modules/.bin /文件夹不包含所有必需的可执行文件,例如tslint,这是ionic-app-scripts的依赖项,所以它不是直接在我的package.json.
结果是当我使用Yarn时,ionic-app-scripts不起作用,因为它期望该.bin文件夹包含tslint可执行文件!
我能做什么?ionic-app-scripts的定义是一个问题吗?
[注意]:npm install工作正常,但Yarn更快!
我正在尝试使用pan手势设置滑块(实际上是厨房计时器),ionic2请参阅:http://ionicframework.com/docs/v2/components/#gestures
滑块/计时器有一个开放的上限,可以由a设置panright,但在a上下降到零panleft.
如何才能最好地将pan事件转换为速度敏感度,以允许上限接近36000但是足够敏感以设置小到10的增量?最大值deltaX约为400px,但我想用户可以使用几个pan手势来达到很大的值.
是否有一些现成的easing功能可以用来实现这个目的?
我正在尝试使用延迟加载创建一个离子3选项卡应用程序,而无需导入组件.
在我的app.component.ts中
rootPage:string = "Tabs";
Run Code Online (Sandbox Code Playgroud)
在tabs.html中
<ion-tabs>
<ion-tab [root]="Favorites" tabTitle="fav" tabIcon="star"></ion-tab>
<ion-tab [root]="libaray" tabTitle="Library" tabIcon="book"></ion-tab>
</ion-tabs>
Run Code Online (Sandbox Code Playgroud)
在Favorites.module.ts中
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { Favorites } from './favorites';
@NgModule({
declarations: [
Favorites,
],
imports: [
IonicPageModule.forChild(Favorites),
],
exports: [
Favorites
]
})
export class FavoritesModule {}
Run Code Online (Sandbox Code Playgroud)
到目前为止,标签页成功加载但没有视图(空白页).我认为我使用[root]属性与延迟加载的问题!怎么解决这个问题?
谢谢
如何验证和显示Ionic 2或3中警报控制器中输入的错误
let prompt = Alert.create({
title: 'Alert input validation',
message: "How can I validate below input field?",
inputs: [
{
name: 'email',
placeholder: 'email'
},
],
buttons: [
{
text: 'Save',
handler: data => {
let validateObj = this.validateEmail(data);
if (!validateObj.isValid) {
alert(validateObj.message);
return false;
} else {
//make HTTP call
}
}
}
]
});
Run Code Online (Sandbox Code Playgroud)
有人已经更新了警报控制器,并确实拉动了Ionic团队的请求.我认为Ionic团队规划将来会实现这一点. https://github.com/ionic-team/ionic/pull/12541
我需要一些解决此验证功能的方法.
plnkr http://plnkr.co/edit/IBonfBJngky0h8UtMwMD?p=preview
感谢您的帮助.
页面上显示一个按钮.当用户选择子组件将出现的按钮时,会出现以下错误 - 错误:未捕获(在承诺中):错误:找不到ModalComponent的组件工厂.你有没有把它添加到@ NgModule.entryComponents?
我设置的结构如下,这与Ionic 3一起 -
app (folder)
- app.module
- app.component
components (folder)
- modal-component.ts
pages (folder)
- pageOne (folder)
- pageOne.module
- pageOne.ts
Run Code Online (Sandbox Code Playgroud)
我把模态组件放在pageOne.module中
pageOne.module
@NgModule({
declarations: [
pageOne,
modalComponent
],
entryComponents: [
modalComponent
],
imports: [
IonicPageModule.forChild(pageOne),
],
exports: [
pageOne,
]
})
export class pageOneModule {}
Run Code Online (Sandbox Code Playgroud)
pageOne.ts
@IonicPage()
@Component({
selector: 'pageOne',
templateUrl: 'pageOne.html',
})
export class pageOne {}
Run Code Online (Sandbox Code Playgroud)