标签: ionic2

如何在单击时将元素滚动到视图中

我正在寻找类似于scrollIntoView()Ionic2中的东西,以便在我点击按钮时使用.

ion-content帮助中没有详细说明的方法.

typescript ionic-framework ionic2 ionic3 angular

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

如何将参数传递给Ionic2/Angular2中的提供者构造函数?

我试图将我的Ionic2.beta11应用程序移植到新的Ionic2.rc0版本.大多数事情都非常简单,但我对AoT编译器有疑问.

我有一个AuthService:

@Injectable()
export class AuthService {
  constructor(@Inject(Http) http: Http) {
    this.http = http;
  }
  ...
}
Run Code Online (Sandbox Code Playgroud)

我将它注入我的src/app/app.module.ts文件中的应用程序:

@NgModule({
  declarations: [
    MyApp,
    ...
  ],
  imports: [
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    ...
  ],
  providers: [
    AuthService
  ]
})
Run Code Online (Sandbox Code Playgroud)

运行离子服务时一切正常,但是当我尝试构建它时,我收到以下错误:

ngc error: Error: Error at .../.tmp/app/app.module.ngfactory.ts:397:78: Supplied parameters do not match any signature of call target.
Run Code Online (Sandbox Code Playgroud)

396 - 399行:

get _AuthService_74():import44.AuthService {
  if ((this.__AuthService_74 == (null as any))) { (this.__AuthService_74 = new import44.AuthService()); }
  return this.__AuthService_74;
} …
Run Code Online (Sandbox Code Playgroud)

dependency-injection typescript ionic2 angular

10
推荐指数
2
解决办法
8137
查看次数

Ionic 2 dev和prod环境变量

我正在研究Ionic 2项目,我想为不同的环境(如开发和生产)配置它.但是,我不知道在配置文件放在离子2中的位置.有没有办法放置配置文件和运行命令

喜欢

ionic build android --prod
Run Code Online (Sandbox Code Playgroud)

和

ionic build android --dev
Run Code Online (Sandbox Code Playgroud)

android environment-variables ionic2 angular

10
推荐指数
1
解决办法
4598
查看次数

如何更新离子2侧菜单中的值

如何将日期从页面"转移"到side-menuIonic2中,即 - 具有app.page.html以下内容:

<ion-menu [content]="content">

    <ion-content class="menu-left">
        <!-- User profile -->
        <div text-center padding-top padding-bottom class="primary-bg menu-left">
            <a menuClose>
                <h4 light>{{userName}}</h4>
            </a>
        </div>

        <ion-list class="list-full-border">
            <button ion-item menuClose *ngFor="let page of pages" (click)="openPage(page)">
        <ion-icon item-left name="{{ page.icon }}"></ion-icon>
        {{ page.title }}
        <ion-badge color="danger" item-right *ngIf="page.count">{{ page.count }}</ion-badge>
      </button>
        </ion-list>
    </ion-content>

</ion-menu>

<ion-nav [root]="rootPage" #content swipeBackEnabled="false"></ion-nav>
Run Code Online (Sandbox Code Playgroud)

如何userName根据数据从页面中的操作更新值facebookLogin.page?

facebookLogin.page.ts:

...
fbLogin() {
    Facebook.login(["public_profile", "email"])
      .then((resp: FacebookLoginResponse) => {

        if (resp.status === "connected") { …
Run Code Online (Sandbox Code Playgroud)

javascript typescript ionic2 ionic3 angular

10
推荐指数
1
解决办法
6633
查看次数

无法使用ngx translate/core - angular 2 typescript获得动态的文本翻译

问题:

我有来自Json文件的动态文本.我正在使用这样的translate.get()方法:

this.translate.get('keyInJson').subscribe(res => { 
                this.valueFromJson = res;
/*
creating an object using above text
*/
            });
Run Code Online (Sandbox Code Playgroud)

因为这是异步的,所以当页面呈现时我无法获得翻译的文本.我尝试在Observables,Promises中包装上面的方法但是在页面加载期间它无法获得翻译版本的文本.在尝试不同的方法之后,我能够获得翻译后的文本,但代码变得过于复杂且不可靠.

预期/期望的行为 应加载翻译版本的文本

复制问题 动态生成文本而不是在html上对其进行硬编码,然后尝试渲染翻译版本.

环境 Angular2,打字稿,离子2

javascript typescript ionic2 angular

10
推荐指数
2
解决办法
6182
查看次数

如何在离子切换上处理点击功能

这是我的.html文件

<ion-item no-lines (click)="update()" >
        <ion-label> Notification</ion-label>
        <ion-toggle [(ngModel)]="notify" ></ion-toggle>
    </ion-item>
Run Code Online (Sandbox Code Playgroud)

上面的代码工作时,我点击Notification文本,但当我点击ion-toggle我无法调用该功能,我该怎么做才能调用该功能.

这是我的.ts文件

update(){
 console.log("invoking notification");
}
Run Code Online (Sandbox Code Playgroud)

ion-toggle ionic2 angular

10
推荐指数
1
解决办法
9893
查看次数

离子2滚动性能问题

关于ionic2和Angular2的博客和评论给我留下了深刻的印象,我开始在离子2中编写一个应用程序,并发现ionic2滚动性能不适合iOS和Android的大量记录.

  1. 我在大多数列表项中的图像之间有一个很大的项目列表
  2. 滚动性能适用于10到20个项目,但它涉及30多个项目时非常慢
  3. 经过大量搜索后发现虚拟滚动离子并使用它然后性能略有改善,最多50项,但在65项以上后再次减速

我在iOS中尝试过WKWebview,在性能方面有一些改进,但是对于大型列表,屏幕常常变为黑色,所以我放弃了这个想法.由于应用程序的大小增加,我不想使用人行横道,所以从未尝试过.

任何人都可以帮助建议任何解决方法来解决此问题或任何纯JavaScript框架解决方案,以显示没有任何问题的大型列表?适用于Android和ios.

javascript performance android ios ionic2

9
推荐指数
1
解决办法
800
查看次数

Ionic 2 - Slider - 显示第二张幻灯片项目的一部分

我想展示第二个幻灯片项目的一部分,但不知道该怎么做.这是我到目前为止(基本的离子幻灯片):

<ion-slides pager >
            <ion-slide>
              <h2>Slide 1</h2>
            </ion-slide>

            <ion-slide>
              <h2>Slide 2</h2>
            </ion-slide>

            <ion-slide>
              <h2>Slide 3</h2>
            </ion-slide>
</ion-slides>
Run Code Online (Sandbox Code Playgroud)

这就是我想要的方式: 在此输入图像描述

我试图将离子滑片的宽度改为小于100%,但是第二张和第三张幻灯片只是从屏幕左侧进一步向左移动.

谁能帮我 ?

ionic-framework ionic2 ion-slide-box angular

9
推荐指数
2
解决办法
7797
查看次数

计算传单中两点之间的距离

如何计算Leaflet-ionic2中两个标记之间的距离?

不知道,我希望有一个Algorithme可以在我选择一个标记时立即执行,它会向我显示我的位置和标记之间的距离。

谢谢..

geolocation leaflet ionic2

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

离子 - 为浏览器构建/运行

我有一个我已经构建的离子应用程序(当前版本),它现在在我的本地开发服务器上运行就好了.我需要添加Strip Payment集成,因此我包含了cordova-stripe-plugin(https://github.com/zyra/cordova-plugin-stripe#module_stripe).我无法测试,因为离子服务不包括cordova.js等.我看起来高低,无法找到任何权威 信息或如何为移动浏览器/网络/ PWA运行/构建此应用程序的指南.有相互矛盾的信息.你能澄清并提供命令行来运行构建/运行和我可以部署到我的网络服务器的Ionic应用程序.另外,测试怎么样?我每次需要进行更改时都需要重建,还是可以使用某种实时重新加载?谢谢你的帮助.

cordova ionic-framework ionic2

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