标签: ionic2

Ionic2,Angular2,HTTP和Observables

在阅读了我发现的关于可观察物的几乎所有内容之后,我仍然不太了解它们是如何工作的.

我在这里做http请求:

import { Component, OnInit, Injectable } from '@angular/core';
import { Http, Response, Headers, RequestOptions } from '@angular/http';
import { NavController } from 'ionic-angular';
import { Observable } from 'rxjs/Rx';    
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';

@Injectable()
@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

    webs: any;

    getWebs(): any{
        return this.http.get( 'here the url' )
        .map((res: Response) => res.json());
    }

    constructor(public navCtrl: NavController, private http: Http) {}

    ngOnInit(){
        this.getWebs().subscribe(response => {
            this.webs = response;
            console.log(this.webs);
        });
    }
}
Run Code Online (Sandbox Code Playgroud)

在控制台上,正确打印this.webs.这意味着,get请求工作正常,我正在检索我想要的对象.这是一个普通的JSON对象. …

javascript observable typescript ionic2 angular

2
推荐指数
1
解决办法
427
查看次数

离子 - svg没有出现

我做了离子2 sidemenu的应用程序构建,但是svg出现在Chrome中,但生成文件android-debug.apk后svg没有出现在Android中:

在此输入图像描述

按照我使用的命令:

npm install -g ionic cordova ionic start myApp --v2 sidemenu ionic platform add android ionic build android

/myApp/src/pages/page1/page1.html

<ion-header>
    <ion-navbar>
        <button ion-button menuToggle>
            <ion-icon name="menu"></ion-icon>
        </button>
        <ion-title>Page One</ion-title>
    </ion-navbar>
</ion-header>
<ion-content padding>
    <h3>Ionic Menu Starter</h3>
    <img src="../../assets/img/myapp.svg" alt="">
    <p>
        If you get lost, the
        <a href="http://ionicframework.com/docs/v2">docs</a> will show you the way.
    </p>
    <button ion-button secondary menuToggle>Toggle Menu</button>
</ion-content>
Run Code Online (Sandbox Code Playgroud)

你能帮我解决这个问题吗?

svg android cordova ionic-framework ionic2

2
推荐指数
1
解决办法
5134
查看次数

Karma测试在chrome中失败但是通过了phantomjs

我现在一直在与此斗争,似乎无法找到正确的解决方案,

我正在运行一个使用角度2的测试环境的离子2项目,当我使用karmas chrome启动器运行测试时,我收到以下错误:

开始:

07 12 2016 11:20:50.590:INFO [业力]:Karma v1.2.0服务器始于http:// localhost :8888/07 12 2016 11:20:50.591:INFO [launcher]:启动具有无限并发性的浏览器Chrome 07 12 2016 11:20:50.682:INFO [启动器]:启动浏览器Chrome 07 12 2016 11:20:52.993:INFO [Chrome 55.0.2883(Linux 0.0.0)]:已连接到socket /#wi3gg8nwMc27F0H4AAAA,ID为3728337

完成时间为0.002秒/ 0秒

摘要:✔0测试完成

但是当使用PhantomJS时,所有测试都运行得很好.

我正在运行的系统是:

  • Linux ubuntu 16.04LT
  • NodeJs:6.9.2
  • Npm:3.10.8

我已经尝试重新安装所有模块,我重新安装了操作系统,我已经在另一个Linux系统上安装了项目,它与同一环境完美配合

我的karma.conf.js文件如下


    module.exports = function (config) {
        config.set({
            basePath: '../',
            frameworks: ['jasmine', 'angular-cli'],
            plugins: [
                require('karma-jasmine'),
                require('karma-chrome-launcher'),
                require('karma-phantomjs-launcher'),
                require('karma-remap-istanbul'),
                require('karma-mocha-reporter'),
                require('angular-cli/plugins/karma')
            ],
            files: [
                { pattern: './src/test.ts', watched: false }
            ],
            preprocessors: {
                './src/test.ts': ['angular-cli']
            },
            remapIstanbulReporter: {
                reports: { …

node.js typescript karma-runner ionic2 angular

2
推荐指数
1
解决办法
1229
查看次数

离子2 - 设定模型驱动形式的值

当我加载这个时,我想要将以前保存的值从本地存储器归因于此表单时,我会遇到与Ionic 2中内置的模型驱动表单相关的内容.

我设法使用Ionic的存储服务保存它,但是我没有将这些保存的数据归因于表单.我收到以下错误:

TypeError:设置只有getter的属性

这是我的代码,到目前为止:

import { Component } from '@angular/core';
import { Validators, FormBuilder, FormGroup } from '@angular/forms';
import { NavController, NavParams } from 'ionic-angular';
import { Storage } from '@ionic/storage';

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

export class Survey {
  form: FormGroup;
  networkStatus: boolean = true;

  constructor(public navCtrl: NavController, public navParams: NavParams,
              public formBuilder: FormBuilder, private storage: Storage) {

    // localstorage 
    this.storage = storage;

    this.form = formBuilder.group({
      "isPropertyOwner": ["", Validators.required],
      "familyMembers": ["", Validators.compose([Validators.required, Validators.minLength(0)])],
      "ownsProperty": ["", …
Run Code Online (Sandbox Code Playgroud)

local-storage ionic2 angular2-forms angular

2
推荐指数
1
解决办法
3601
查看次数

在应用关闭离子2之前显示确认提醒

我用离子2制作一个应用程序.我试图在关闭应用程序之前获得确认警报.

我该怎么做 ?

ionic2

2
推荐指数
2
解决办法
1万
查看次数

如何在ionic2中执行只读或禁用?

实际上我试图将一个字段设置为只读或禁用为ionic2形式:

<ion-item>
    <ion-label fixed>Category <ion-icon name="ios-arrow-forward"></ion-icon></ion-label>
    <ion-input type="text" [disabled]="false" id="category_name" class="form-control" formControlName="category_name" (click)="category()" [(ngModel)]="category_name"></ion-input>
</ion-item>
Run Code Online (Sandbox Code Playgroud)

我也用[readonly] ="false".

我知道这也是一个问题,git也存在问题:

https://github.com/driftyco/ionic/issues/6408 ..

所以任何帮助我如何解决它.

ionic2 angular

2
推荐指数
1
解决办法
8490
查看次数

如何在没有TypeError的情况下执行ng-xi18n:无法读取undefined的属性'create'?

我想在Ionic 2项目中使用Angular 2的国际化(i18n).不幸的是,我无法使用ng-xi18n工具尝试以下命令创建翻译源文件:

./node_modules/.bin/ng-xi18n
Run Code Online (Sandbox Code Playgroud)

出现以下TypeError:

TypeError: Cannot read property 'create' of undefined
    at Function.Extractor.create (/Users/user/Development/app/node_modules/@angular/compiler-cli/src/extractor.js:69:45)
    at extract (/Users/user/Development/app/node_modules/@angular/compiler-cli/src/extract_i18n.js:7:34)
    at Object.main (/Users/user/Development/app/node_modules/@angular/tsc-wrapped/src/main.js:47:16)
    at Object.<anonymous> (/Users/user/Development/app/node_modules/@angular/compiler-cli/src/extract_i18n.js:14:9)
    at Module._compile (module.js:570:32)
    at Object.Module._extensions..js (module.js:579:10)
    at Module.load (module.js:487:32)
    at tryModuleLoad (module.js:446:12)
    at Function.Module._load (module.js:438:3)
    at Module.runMain (module.js:604:10)
Extraction failed
Run Code Online (Sandbox Code Playgroud)

我尝试升级我的软件包但没有成功.这里是我在文件中的依赖项package.json

"dependencies": {
    "@angular/common": "2.0.0-rc.4",
    "@angular/compiler": "2.0.0-rc.4",
    "@angular/compiler-cli": "^2.4.0",
    "@angular/core": "2.0.0-rc.4",
    "@angular/forms": "0.2.0",
    "@angular/http": "2.0.0-rc.4",
    "@angular/platform-browser": "2.0.0-rc.4",
    "@angular/platform-browser-dynamic": "2.0.0-rc.4",
    "@angular/platform-server": "^2.4.0",
    "es6-shim": "0.35.1",
    "ionic-angular": "2.0.0-beta.11",
    "ionic-native": "1.3.10",
    "ionicons": "3.0.0",
    "reflect-metadata": "0.1.8", …
Run Code Online (Sandbox Code Playgroud)

ionic2 angular

2
推荐指数
1
解决办法
1458
查看次数

离子上传给出了Forbidden upload(403)错误

嗨,我正在使用离子2,我成功地上传了我的应用程序.但今天我使用'ionic upload'命令得到以下错误:

Uploading app....
An error occurred uploading the build: Forbidden upload (403)

Forbidden upload (403) (CLI v2.1.17)

Your system information:

Cordova CLI: 6.4.0
Ionic Framework Version: 2.0.0-rc.4
Ionic CLI Version: 2.1.17
Ionic App Lib Version: 2.1.7
Ionic App Scripts Version: 0.0.47
ios-deploy version: 1.8.2
ios-sim version: 3.1.1
OS: macOS Sierra
Node Version: v6.9.2
Run Code Online (Sandbox Code Playgroud)

有什么不对?

ionic-framework ionic2

2
推荐指数
1
解决办法
416
查看次数

没有ConnectionBackend for ionic 2的提供者

即时通讯使用离子2和我创建一个简单的服务

import { Injectable } from '@angular/core';
import { Http } from '@angular/http';

@Injectable()
export class EliteApi {

  private baseUrl="https://myurl.com";
    constructor(private http:Http) { }

    getTournaments(){
      return new Promise(resolve =>{
        this.http.get(this.baseUrl + 'tournaments.json').subscribe(res => resolve(res.json()));

      });
    }
}
Run Code Online (Sandbox Code Playgroud)

然后我在这样的app.component.ts上导入它来注册服务

import { EliteApi } from './shared/shared';
import {Http} from "@angular/http";

@Component({
  templateUrl: 'app.html',
  providers: [EliteApi,Http]
})
Run Code Online (Sandbox Code Playgroud)

在我的页面上,我导入服务

import { EliteApi } from '../../app/shared/shared';
Run Code Online (Sandbox Code Playgroud)

并且在加载的事件上我写了这个来获取json数据

  ionViewLoaded(){
    this.eliteApi.getTournaments().then(data => this.tournaments = data);
  }
Run Code Online (Sandbox Code Playgroud)

它给了我例外说没有ConnectionBackend的提供者!

我尝试过像这里类似的一些问题,将服务放在提供商身上

@NgModule({providers:[EliteApi

但同样的错误

ionic-framework ionic2 angular

2
推荐指数
1
解决办法
4845
查看次数

离子2中的提醒/报警

我试图在一段时间后在ionic2中实现提醒/报警.我已经找到了这个插件https://github.com/wnyc/cordova-plugin-wakeuptimer但是我想用typescript 来实现它,因为这是无法识别的window.wakeuptimer在下面提到的代码中使用:

window.wakeuptimer.wakeup( successCallback,  
   errorCallback, 

   // a list of alarms to set

   {

        alarms : [{

            type : 'onetime',

            time : { hour : 14, minute : 30 },

            extra : { message : 'json containing app-specific information to be posted when alarm triggers' }, 

            message : 'Alarm has expired!'

       }] 

   }

); 
Run Code Online (Sandbox Code Playgroud)

任何人都可以帮助我

android reminders cordova ionic-framework ionic2

2
推荐指数
1
解决办法
8548
查看次数