标签: ionic2

我正在创建一个Ionic应用程序,我正在使用制表符.我希望能够使用附加到选项卡模板的typescript组件类从一个选项卡导航到另一个选项卡.例如,应在选项卡1中触发事件时激活选项卡2.

我的选项卡在选项卡中加载良好,只要我手动单击选项卡移动,所有内容都很好,但尝试在后面的代码中切换上下文非常棘手.

在加载时,我可以通过简单地将ion-tabs的[selectedIndex]属性设置为我的tabs组件类中的属性值,使任何一个选项卡处于活动状态.

选项卡父模板 - tab.html

<ion-tabs #tabParent [selectedIndex]="tabToShow">
  <ion-tab tabTitle="Tab 1" [root]="tab2" [rootParams]="{parent : tabParent}"></ion-tab>
  <ion-tab tabTitle="Tab 2" [root]="tab2" [rootParams]="{parent : tabParent}></ion-tab>
  <ion-tab tabTitle="Tab 3" [root]="tab3" [rootParams]="{parent : tabParent}></ion-tab>
</ion-tabs>

组件 - tab.ts

import {Page} from 'ionic-angular';
import {Tab1} from '../tab1/tab1.ts';
import {Tab2} from '../tab2/tab2.ts';
import {Tab3} from '../tab3/tab3.ts';

@Page({
templateUrl : 'build/pages/tab/tab.html'
})

export class Tab{

tab1: any;
tab2: any;
tab3: any;

tabToShow : number = 1;

ngOnInit(){
 this.tab1 = Tab1;
 this.tab2 = Tab2;
 this.tab3 = Tab3;
 } …

我是离子2的新手,我试图插入一个图像,但我没有意识到真正的路径.在文件app/pages/getting-started/getting-started.html中

<ion-content padding class="getting-started">
  <ion-card>
    <ion-card-content>
      <img src="img1.png" alt="">
      <img src="img/img1.png" alt="">
      <img src="../img/img1.png" alt="">
    </ion-card-content>
  </ion-card>
</ion-content>

创建一个文件夹app/img并在其中插入一个img1.png文件.和app/pages/getting-started文件夹中的相同文件.

所以,这应该很容易,但在离子文档中找不到任何内容.

谢谢

有没有人有关于如何在Ionic 2/Angular 2项目中使用Cordova Native File Plugin的完整示例？

我安装了这个插件,但文档似乎对我来说没有多大意义,因为它是碎片化的,缺乏一个完整的例子,包括所有需要的导入.

例如,以下示例不显示LocalFileSystem或窗口等对象的来源.

window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, function (fs) {

    console.log('file system open: ' + fs.name);
    fs.root.getFile("newPersistentFile.txt", { create: true, exclusive: false }, function (fileEntry) {

        console.log("fileEntry is file?" + fileEntry.isFile.toString());
        // fileEntry.name == 'someFile.txt'
        // fileEntry.fullPath == '/someFile.txt'
        writeFile(fileEntry, null);

    }, onErrorCreateFile);

}, onErrorLoadFs);

例如,我需要创建一个属性文件.首先,我需要检查应用程序沙箱存储区域中是否存在文件,如果不存在,我必须创建它.然后我必须打开文件写入数据并保存.我怎么能这样做？

我从angular2和ionic2开始;

在ionic2中,我有一个按钮,可以调用我的组件的方法.像这样:

<button secondary clear large>
</button>

我应该使用(click)- angular2 OR (tap) - ionic2？

像这样:

(click)

<button secondary clear large (click)="pause()">
</button>

(tap)

<button secondary clear large (tap)="pause()">
</button>

有一些区别吗？您可以(tap)在 http://ionicframework.com/docs/v2/components/#gestures中看到

谢谢.

我是离子的新手,我想在android studio模拟器上运行我的应用程序.我确实参考了链接 https://developer.android.com/studio/run/index.html.但我似乎不明白如何在模拟器上运行我的离子应用程序

我从模态中获取值,我想在ionic2 angular2项目中使用本地存储来存储和获取它.我的代码如下.它给出以下错误:

在home.ts页面中,我已导入存储

import { Storage } from '@ionic/storage';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html',
  providers :[
  Storage
]
})

export class HomePage {
 private DistanceUnit: string;
 private selectedRadious : number;

 constructor(public navCtrl: NavController
          public modalCtrl: ModalController,
          public storage: Storage) {


}

presentModal() {
this.storage.get('distUnit').then((val) => {
  console.log('Your distUnit is', val);
  this.DistanceUnit = val;     
})
.catch(err=>{
  console.log('Your distUnit dont exist: ' + JSON.stringify(err));
  this.DistanceUnit = 'Meters';
});

 this.storage.get('SetRadious').then((val) => {
  console.log('Your SetRadious is', val);
  this.selectedRadious = val;
})
 .catch(err=>{ …

我正在寻找一种方法来访问外部js文件中的变量,该文件包含在assets/data文件夹中

以下是我试过的

放置test.js在资产/数据文件夹

在test.js添加变量testvar = "heloo from external js";

添加了脚本标签 src/index.html <script src="assets/data/test.js"></script>

在app.component.ts我增加进口之后此线;declare var testvar: any;

在构造函数中添加此行以记录该值 console.log(testvar);

结果是错误:ERROR ReferenceError:未定义testvar

那么,我如何在打字稿中使用我的js变量？

在我的Ionic2项目中,我将我的字体(ttf格式)放在www/build/fonts文件夹中.但是当我构建应用程序时,字体消失了.

我能怎么做 ？

有很多关于"地图不是函数"的问题,但几乎每个人都没有导入rxjs库.

在我的情况下,我做导入,但错误仍然存​​在.

我使用Ionic 2,这就是我的package.json依赖关系的样子:

"dependencies": {
"@angular/common": "2.0.0",
"@angular/compiler": "2.0.0",
"@angular/compiler-cli": "0.6.2",
"@angular/core": "2.0.0",
"@angular/forms": "2.0.0",
"@angular/http": "2.0.0",
"@angular/platform-browser": "2.0.0",
"@angular/platform-browser-dynamic": "2.0.0",
"@angular/platform-server": "2.0.0",
"@ionic/storage": "1.0.3",
"ionic-angular": "2.0.0-rc.1",
"ionic-native": "2.2.3",
"ionicons": "3.0.0",
"rxjs": "5.0.0-beta.12"
}  

这就是我创建服务的方式:

import { Injectable } from '@angular/core';
import { Http, Headers, RequestOptions, Response } from '@angular/http';
import { Observable } from 'rxjs';
import 'rxjs/add/operator/map';

@Injectable()
export class LoginService {
    constructor(private http: Http) {

    }

    private dataUrl = '/node';

    getData() : any {
        this.http.get(this.dataUrl)
            .map(response => …

我有一个输入字段和一个按钮.它必须在启动时禁用.当输入无空白时,按钮启用.

我使用ngModel获取输入的值,并使用函数(更改)在每次更改输入时启动函数.

现在我在改变功能中做了一点.

if(input !== ''){
//enable the button
}else{
//disable the button
}

你知道如何实现这个目标吗？

谢谢