我使用 ion-icon 作为
.html
<ion-icon name="ios-thumbs-up-outline" [style.color]="'#EF3B51'"></ion-icon>
Run Code Online (Sandbox Code Playgroud)
当我这样做时,图标的轮廓变为红色,但我想在图标内的空白区域填充红色。
您可以看到下图:
我正在学习 Ionic 应用程序。我接触到了 Grid 的东西,但是,我一直坚持删除/修改行之间的空格(第 2 行和第 3 行),如下面的屏幕截图所示:
我的 HTML 中有以下代码:
<ion-content padding>
<ion-row>
<ion-label> I am good I do not want any space.</ion-label>
</ion-row>
<ion-row>
<div >
<div class="inner">
<ion-label *ngIf="!inverse" no-margin>1 USD = 67 INR</ion-label>
<ion-label *ngIf="inverse" no-margin>1 INR = {{(1/67) | number }} USD </ion-label>
</div>
<button (click)="inverse=!inverse" ion-button clear class="iconWidth" color="dark"> <ion-icon name="swap" class="rotate"></ion-icon></button>
</div>
</ion-row>
<ion-row>
<p>Can you help me to get rid of space between this row and above</p>
<ion-label> Thanks</ion-label>
</ion-row>
</ion-content> …Run Code Online (Sandbox Code Playgroud) 我用于ion-select选择一个选项,我想更改 的文本颜色ion-option。我的代码如下...
<ion-item>
<ion-select interface="popover" [(ngModel)]="selectedGrp" (ionChange)="changeGrp()">
<ion-option value="" selected disabled>Select</ion-option>
<ion-option *ngFor="let item of List;let i = index" [value]="item">{{item.name}} </ion-option>
</ion-select>
</ion-item>
Run Code Online (Sandbox Code Playgroud)
没有 SASS 变量来执行此操作。我尝试过使用 css 和样式,但它不起作用。谁能帮我改变ion-option文字颜色?
我已根据本教程将网络信息插件安装到我的Ionic 2应用程序中:
但是,TypeScript无法编译,因为它无法在状态数组行中找到"连接"的引用.知道如何根据Platform,Page等为它编写import语句吗?
我的课:
import {NavController, NavParams} from 'ionic-framework/ionic';
import {Page, ViewController, Platform, Alert, Modal, Events} from 'ionic-framework/ionic';
import {forwardRef} from 'angular2/core';
import {OnInit} from 'angular2/core';
import {Injectable} from 'angular2/core';
import {TodosService} from '../../services/TodosService';
import {MyTodosItem} from '../../pages/my-todos-item/my-todos-item';
@Page({
templateUrl: 'build/pages/my-todos/my-todos.html'
})
class TodayPage {
constructor(
private platform: Platform,
private nav: NavController,
private _events: Events,
private _todosService: TodosService) {
this._platform = platform;
this._isAndroid = platform.is('android');
}
ngOnInit() {
this.getItems();
this._events.subscribe('item:updated', () => {
this.getItems();
});
this.checkNetwork();
} …Run Code Online (Sandbox Code Playgroud) 嗨,我正在学习Ionic 2,我需要更改Ionic 2 app.js中的变量,这是我相信的根控制器.
我开始使用一个新的应用程序
离子启动myApp教程--v2
这是我的app.html
<ion-menu id="leftMenu" [content]="content">
<ion-content>
<ion-item class="menu-background">
<div class="welcome-div">
<img [src]="pictureURL" class="avatar-image"/>
<span class="welcome-message">Welcome {{userName}}</span>
</div>
</ion-item>
<ion-list>
<button class="asbestos" ion-item *ngFor="#p of pages" (click)="openPage(p)">
{{p.title}}
</button>
</ion-list>
<div>
<p class="copyright asbestos">© 2016. All rights reserved</p>
</div>
</ion-content>
</ion-menu>
<ion-nav id="nav" [root]="rootPage" #content swipe-back-enabled="false"></ion-nav>
Run Code Online (Sandbox Code Playgroud)
这是我的app.js
import {App, IonicApp, Platform} from 'ionic-framework/ionic';
import {Home} from './pages/home/home';
import {Status} from './pages/status/status';
import {Wallet} from './pages/wallet/wallet';
import {History} from './pages/history/history';
import {EarnMoney} from './pages/earnmoney/earnmoney';
import {ContactUs} from …Run Code Online (Sandbox Code Playgroud) 大家好我是新来Angular JS和Ionic Framework,我学习都采用了最新的版本,angular2和ionic2.
我想在我的应用程序中使用PixiJs(2D webGL renderer),但我不知道如何在Ionic2应用程序中添加第三方JavaScript库.
以下我试过:
安装了第三方库
npm install pixi --save
进口
import {PIXI} from 'pixi';
运用
var stage = new PIXI.Stage(0x66FF99);
错误: TypeError: Cannot read property 'Stage' of undefined
请帮我.
我有两个文本字段,必须从两个文本字段中获取数据并使用LocalStorage存储它.所以这里是我已经实现的代码,但它不起作用你能告诉我解决它.
在page1.html中
<ion-input [(ngModel)]="hour" type="number" ></ion-input>
<ion-input [(ngModel)]="min" type="number" ></ion-input>
<button clear (click)="setTime(hours.value,min.value)" item-right >settime</button>
Run Code Online (Sandbox Code Playgroud)
在pag1.ts
export class Page1 {
public hour;
public min;
public local:Storage;
constructor(public nav: NavController, translate:TranslateService) {}
setTime(hour, min){
if(hour<24 && hour>0 && min>0 && min<61){
this.local.set('hour',JSON.stringify(hour));
this.local.set('min',JSON.stringify(min));
}
else{
console.log("OUTOF LIMIT TIME EXCEPTION the values are "+hour+min);
}
}
}
Run Code Online (Sandbox Code Playgroud)
在控制台日志上,它显示
[Object Object]在最后
并且也请告诉得到 从localStorage的.提前致谢 :-)
在我的Ionic2项目中,我有三个选项卡的标签视图:
tabs.ts
<ion-navbar *navbar>
<ion-title>My tab parent title</ion-title>
</ion-navbar>
<ion-tabs>
<ion-tab [root]="tab1Root" tabIcon="people"></ion-tab>
<ion-tab [root]="tab2Root" tabIcon="person"></ion-tab>
<ion-tab [root]="tab3Root" tabIcon="globe"></ion-tab>
</ion-tabs>
Run Code Online (Sandbox Code Playgroud)
有谁知道如何以编程方式ion-title从其中一个子选项卡更改此页面?
嗨,我是离子的新手,我有以下的html和js代码.我试图在单击按钮时获取文本框上的用户输入值.(如果可能的话,我想将它存储到一个对象或一个本地缓存中,以便它可以在整个同一个会话中使用)
<ion-navbar *navbar hideBackButton>
<ion-title>Welcome</ion-title>
</ion-navbar>
<ion-content>
<ion-list>
<ion-item>
<ion-label floating>Please enter a nickname</ion-label>
<ion-input type="text" value=""></ion-input>
</ion-item>
</ion-list>
<div padding>
<button (click)="login()" primary block>Continue</button>
</div>
Run Code Online (Sandbox Code Playgroud)
接下来是我的.js代码
import {Component} from "@angular/core";
import {MenuController, NavController, Alert} from "ionic-angular";
import {Index} from "../index/index";
@Component({
templateUrl: 'build/pages/login/login.html'
})
export class Login {
static get parameters() {
return [[MenuController], [NavController]];
}
constructor(menu, nav) {
this.menu = menu;
this.menu.swipeEnable(false);
this.nav = nav;
}
login() {
let alert = Alert.create({
title: 'You have entered',
message: 'Hello', …Run Code Online (Sandbox Code Playgroud) 我有一个问题,我正在使用Ionic 2和angular 2.
我必须在视图中显示一些数据,但是我从同一页面中的API获取这些数据,所以当我尝试在视图中显示它们时,它们尚未定义.获取这些数据后,如何等待加载视图?
我试过onPageWillEnter但它不起作用.
先感谢您.
ionic2 ×10
angular ×6
javascript ×3
html ×2
ionic3 ×2
css ×1
ion-select ×1
ionicons ×1
pixi.js ×1
reference ×1