标签: ionic2

我正在尝试将$log服务用于角度2,根据我的阅读,您需要以下步骤:

1. 创建一个包含要注入的服务的模块.
2. 调用UpgradeAdapter的upgradeNg1Provider方法.

所以,我做了以下几点

  var initInjector = angular.injector(['ng']);
  var $log = initInjector.get('$log');
  angular.module('Services1', [])
    .service('$log', [$log]);
  upgradeAdapter.upgradeNg1Provider('$log');

然后我创建一个角度2组件如下

    @Component({   selector: "ion-app",   template:"<p>Test</p>" })
    @Injectable()
    export class HelloIonicPage {
      message: string;
      constructor( @Inject('$log') $log) {
        this.message = "Hi";
      }
    }

但是当我运行应用程序时,它给出了以下错误:

原始例外:没有提供$ log的提供商!

另外,我试图bootstrap使用upgradeAdapter:

  upgradeAdapter.bootstrap(document.documentElement, ['Services1'])

但那也行不通.请注意,我正在使用Ionic 2框架,上面的代码是在里面写的

    this.platform.ready().then(() => { 
            //The code is going here
});

我很惊讶没有找到任何已经在该主题上创建的线程.

在Ionic 2中,NavController中存在页面的生命周期:ionView[didLoad|didLeave|...]

还有Cordova事件应该像这样调用: document.addEventListener("pause", onPause, false);

我处于一种我希望得到科尔多瓦事件的情况.页面的离子生命周期是不合适的,因为当设备进入onResume任何页面显示的状态时,我想要做的事情需要发生.

我还没有尝试过,因为我希望在此之前找到一个良好的领导继续前进,但我感觉document无法从Angular2,Ionic2访问,我可能将不得不添加服务要访问window它,这里解释.

或者document.addEventListener(...)在Ionic 2中有没有其他已知的方法可以访问？

我希望所有页面都有相同的标题.

什么是最好的方法,而不必在所有页面重复html +代码.

谢谢!

大家好我试图将数据从我的设备视图传递到我的模态(设备详细信息视图)并将其绑定到我的模态,所以如果我这样做(click)=openModal()模态应该打开我点击的参数.但不幸的是,它仍然让任何人知道如何处理它？

//数据源和模态处理程序

import { Component } from '@angular/core';

import { ModalController, Platform, NavParams, ViewController,NavController } from 'ionic-angular';

import { ModalPage } from '../modal/modal';

@Component({
  selector: 'page-deviceslist',
  templateUrl: 'devicelist.html'
})
export class DevicesListPage {

  devices;
  device;
  constructor(
    public  modalCtrl: ModalController,
    public nav: NavController,
    public params: NavParams,
  ) {

    this.devices = [
      {
        title: 'Küche',
        items: [
          {title: 'KüchenAid', consumption:'32 W', checked:'true'},
          {title: 'Thermomix', consumption:'0 W', checked:'false'}
        ]
      },
      {
        title: 'Wohnzimmer',
        items: [
          {title: 'Fernseher',consumption:'0 W', checked:'false'},
          {title: 'Stehlampe',consumption:'60 …

我正在开发一个应用程序,它将有一个付费(完整)版本和一个免费(精简版)版本.

在为Android开发的另一个应用程序中,可以使用flavors(productFlavors)轻松管理它,我可以在其中配置应用程序的任何部分的替换.例如:我可以boolean PAID_VERSION为每个应用程序配置applicationId和flag ,如下所示:

productFlavors {
    free {
        applicationId 'com.mycompany.myapp.free'
        buildConfigField "boolean", "PAID_VERSION", "false"
    }
    paid {
        applicationId 'com.mycompany.myapp.paid'
        buildConfigField "boolean", "PAID_VERSION", "true"
    }
}

在代码中我可以检查PAID_VERSION以下方式的标志:

boolean b = BuildConfig.PAID_VERSION;

如果我想按版本更改图标和应用程序名称,我应该在applicationId每个flavor的packages()中指定替换默认值的特定图标,例如:

String资源应用程序名称:

自由路径: /free/res/values/strings.xml

<resources>
    <string name="app_name">My App - Free</string>
</resources>

付费路径: /paid/res/values/strings.xml

<resources>
    <string name="app_name">My App - Paid</string>
</resources>

图标资源:

自由路径:( /free/res/drawable/icon.pngImagem Free)

付费路径:( /paid/res/drawable/icon.pngImagem付费)

题

怎么可能有一个类似于Ionic2/Cordova项目的配置,这可以通过相同的代码库生成2个具有一些不同功能的应用程序,同时和独立地分布在商店中？

我尝试改变离子2中离子标题的颜色.

我有以下代码:

<ion-header>
  <ion-navbar>
   <ion-title primary>Title</ion-title>
  </ion-navbar>
</ion-header>

颜色ion-title不要改变.我尝试了几件事:

<ion-title color="primary">Title</ion-title> 
<ion-title> 
    <p primary>Title</p>
</ion-title>

第二个我的标题是正确的颜色,但标题很大.所以我在variables.scss中添加它:

$toolbar-ios-height: 5rem; // ios
$toolbar-md-height: 5rem;  // android

但没有任何改变.有人有解决方案吗？或者我是否必须使用p或h标签来改变颜色？

我有一个标签和组单选按钮(两个),我想让它像图片中一样水平对齐.

我试过这段代码:

`<ion-row radio-group [(ngModel)]="Sexe">
  <ion-col>
      <ion-item>
        <ion-label color="primary">Sexe</ion-label>
        <ion-radio value="Mr"></ion-radio>
        <ion-radio value="Mme"></ion-radio>
      </ion-item>
  </ion-col>
</ion-row>`

还有这段代码:

`<ion-row radio-group [(ngModel)]="Sexe">
  <ion-col>
      <ion-item>
        <ion-label color="primary">Sexe</ion-label>
      </ion-item>
      <ion-item>
        <ion-radio value="Mr"></ion-radio>
      </ion-item>
      <ion-item>
          <ion-radio value="Mme"></ion-radio>
      </ion-item>
  </ion-col>
</ion-row>`

但我没有我想要的结果.

我需要根据用户的角色显示侧边菜单项.所以我检查app.html是否页面(角色)等于登录角色.但它在登录后不显示菜单内的项目,但在使用浏览器刷新按钮刷新应用程序后,它会显示正确的项目.我想问题是离子是缓存菜单视图,如果它是如此,我如何刷新应用程序以显示新的菜单项.

每次我使用其他用户/角色登录时,它都会根据之前的用户/角色显示菜单.

app.component.ts

constructor() {
    this.initializeApp();
    this.pages = [
                    { title: 'Home', component: 'HomePage', icon: 'home', role: 5 },
                    { title: 'Profile', component: 'ProfilePage', icon: 'person', role: 5 },
                    { title: 'Account', component: 'AccountPage', icon: 'home', role: 5 },
                    { title: 'Search Employee', component: 'AtlasemployeehomePage', icon: 'home', role: 4 }
                 ];

  }

app.html

<ion-list>
      <div *ngFor="let p of pages">
        <button menuClose ion-item *ngIf="p.role == role"  (click)="openPage(p)">
          <ion-icon  name="{{p.icon}}" style="margin-right:10%"></ion-icon> {{p.title}}
        </button>
      </div>

      <button menuClose ion-item (click)="presentLogout()">
        <ion-icon name="log-out" style="margin-right:10%"></ion-icon> Logout …

我有充满活力array的物品和价值观.当用户单击项目上的按钮时,它应该从视图列表中删除该项目.我完全没猜到为什么会这样.它是如何构建数据的？我不这么认为,因为它表明它正在控制台中删除.无论如何谢谢!

TS:

export class Page{
    items: Item[];

    constructor(public alertCtrl: AlertController){}

    removeitem(i) {
        let confirm = this.alertCtrl.create({
            title: 'Confirm',
            message: "text.",
            buttons: [
                {
                    text: 'Cancel',
                    handler: () => {
                        console.log('Disagree clicked');
                    }
                },
                {
                    text: 'Save',
                    handler: () => { 
                        this.presentToast() 
                        this.items.splice(i, 1);

                    }
                }
            ]
        });
        confirm.present();
    }

getItems(){
   this.stopService.getItems().subscribe(item => { 
     this.items = item 
  })

  }


}

HTML:

<div *ngFor="let item of items; index as i ">
    <h3>{{item.description}}</h3>
    <button item-end ion-button full (click)="removeitem(i)">remove item</button>
</div>

编辑 …

美好的一天,

我正在研究Ionic应用程序,我正在从JSON提要中动态加载图像.我希望当从外部URL拉入图像时,占位符图像显示在其位置,此后,占位符图像应该在加载后由"真实"图像替换.

我目前的情况的一个例子是:

<ion-card *ngFor="let item of items"...
 <img [src]="item.picture" />

感谢和问候.