那些遇到过的问题

标签: ionic-framework

Angularjs嵌套状态:3级

我正在使用Agnularjs和Ionic Framework.我试图实现嵌套状态,如下所示,

  • Eventmenu(根)
  •   家(2级)
  •     首页1(3级)
  •     家2
  •   报到
  •   与会者

我的路线文件看起来像,

angular.module('ionicApp', ['ionic'])

.config(function($stateProvider, $urlRouterProvider) {

  $stateProvider
    .state('eventmenu', {
      url: "/event",
      abstract: true,
      templateUrl: "event-menu.html"
    })
    .state('eventmenu.home', {
      url: "/home",
      views: {
        'menuContent' :{
          templateUrl: "home.html"
        }
      }
    })
      .state('eventmenu.home.home1', {
      url: "/home1",
      views: {
        'menuContent' :{
          templateUrl: "home1.html"
        }
      }
    })
        .state('eventmenu.home.home2', {
      url: "/home2",
      views: {
        'menuContent' :{
          templateUrl: "home2.html"
        }
      }
    })
    .state('eventmenu.checkin', {
      url: "/check-in",
      views: {
        'menuContent' :{
          templateUrl: "check-in.html",
          controller: "CheckinCtrl"
        }
      }
    })
    .state('eventmenu.attendees', { …
Run Code Online (Sandbox Code Playgroud)

angularjs angularjs-routing ionic-framework

Lia*_*iam
lucky-day
31
推荐指数
1
解决办法
2万
查看次数

我可以将ionic serve设置为默认不打开浏览器吗？

我通常有多个浏览器窗口,它总是没有弹出我想要的那个.

我可以在浏览器中禁用离子发球功能吗？

ionic-framework ionic

Ste*_*ung
lucky-day
31
推荐指数
3
解决办法
6670
查看次数

离子 - 错误:找不到模块'android-versions'

当试着跑

ionic run android --device
Run Code Online (Sandbox Code Playgroud)

我收到模块错误:

Error: Cannot find module 'android-versions'
Run Code Online (Sandbox Code Playgroud)

版本:

java -version 
  java version "1.8.0_144"
Android studio Version 2.3.3
ionic -v
2.2.1
cordova -v
6.5.0
Run Code Online (Sandbox Code Playgroud)

android cordova ionic-framework ionic2 ionic3

ehh*_*ehh
2018 03-07
31
推荐指数
2
解决办法
2万
查看次数

此版本的 CLI 仅与 Angular 版本 ^13.0.0 兼容，但找到了 Angular 版本 12.2.13

我的Ionic项目一个月前运行良好。今天，当我尝试ionic serve或 时ionic build，出现以下错误：

在此输入图像描述

哪个 CLI 版本与 Angular 版本 12.2.13 兼容？如果你真的想知道我为什么问这个问题，你可以进一步准备。

所以我按照 Angular 官方网站上的建议升级到 Angular 13，我使用了以下命令：npm @angular/cli@13 update @angular/core@13 @angular/cli@13。

该路线要求我将 Node.js 升级到版本 16（最新、当前）。将 Node.js 升级到 v16 后，我重新尝试升级到 Angular 13，在此过程中，由于不支持的依赖项等原因，安装失败/停止。

我用谷歌搜索了大多数解决方案，进行了尝试，最后得到了一个项目，其中我的所有插件都找不到，等等。因此，我通过将 Node.js v16 卸载到 v12 来反转上述过程，删除 npm、node_modules文件夹，现在我又回到了图中出现以下错误的位置。

这是我的开发环境ionic info：

在此输入图像描述

这是我的package.json文件的副本：

    "dependencies": {
    "@angular/common": "~12.2.8",
    "@angular/core": "~12.2.8",
    "@angular/forms": "~12.2.8",
    "@angular/platform-browser": "~12.2.8",
    "@angular/platform-browser-dynamic": "~12.2.8",
    "@angular/router": "~12.2.8",
    "@babel/compat-data": "^7.8.0",
    "@ionic-native/app-version": "^5.36.0",
    "@ionic-native/call-number": "^5.36.0",
    "@ionic-native/camera": "^5.23.0",
    "@ionic-native/core": "^5.0.0",
    "@ionic-native/device": "^5.36.0",
    "@ionic-native/file": …
Run Code Online (Sandbox Code Playgroud)

node.js ionic-framework angular-cli angular

Mor*_*rgs
2022 02-06
31
推荐指数
4
解决办法
16万
查看次数

如何检测我是否在Ionic 2的浏览器(本地开发)中

我想确保只在我使用设备(iOs,Android ...)时启动inappbrowser,但如果我在浏览器(本地开发模式或只是带有gulp构建的Web应用程序),我想要链接到目标="_空白"的页面.

我正在尝试将Ionic 2代码重用为Web App.所以当我构建应用程序时,它也可以在浏览器桌面上运行.所以platform.ready()对我来说还不够.因为我需要知道用户是否在桌面浏览器上,我可以做一些不同的事情.

cordova ionic-framework ionic2

Hug*_*Hou
2017 05-09
30
推荐指数
5
解决办法
3万
查看次数

在Ionic应用程序中禁用硬件后退按钮？

我正在尝试禁用Cordova应用程序上的后退按钮.我正在使用AngularJS + Ionic Framework.我找到了关于这个的主题并尝试了下面的代码,但它绝对没有效果.任何的想法？谢谢!

的index.html

<head>
    <script>
      document.addEventListener("deviceready", onDeviceReady, false);
        function onDeviceReady() {
            document.addEventListener("backbutton", function (e) {
                e.preventDefault();
                console.log("hello");
            }, false );
        }
    </script>
</head>
Run Code Online (Sandbox Code Playgroud)

请注意,当我按下按钮时,我的控制台中显示"hello".

android dom-events angularjs cordova ionic-framework

Dav*_* D.
2019 08-12
29
推荐指数
3
解决办法
4万
查看次数

在Angular ng-repeat - Ionic Grid中,每2个项后创建一行

我需要通过ng-repeat在我的应用程序中创建如下的strcuture.

<div class="row">
  <div class="col-50">1</div>
  <div class="col-50">2</div>
</div>
<div class="row">
  <div class="col-50">3</div>
  <div class="col-50">4</div>
</div>
Run Code Online (Sandbox Code Playgroud)

现在我的代码如下:

<div class="row">
  <label class="item item-radio col col-50" ng-repeat="a in question.answer">
  <input type="radio" name="answers"   class="a-{{ a.correct }}" value="{{ a.correct }}" ng-click='ansValue("{{ a.correct }}")'> 

  <div class="item-content">
     <img src="img/ans/{{ a.option }}" />
  </div>

  <i class="radio-icon ion-checkmark"></i>
  </label>
</div>
Run Code Online (Sandbox Code Playgroud)

但是在上面的代码中,它只是我拥有的单行标记.我不想以某种方式获得行标记包含/包装循环中的每2个项目.实现这一目标的最佳方法是什么？

参考: Ionic Grid Doc

grid angularjs angularjs-ng-repeat ionic-framework

esa*_*wan
lucky-day
29
推荐指数
3
解决办法
3万
查看次数

Ionic 在 macos 12 中构建失败（蒙特雷）

当我在新更新的 macos 12 (Monterey) 上运行“ionic cordova build ios”时，我收到此错误：

Uncaught Exception:
TypeError: undefined is not iterable (cannot read property Symbol(Symbol.iterator))
at macosRelease (/Applications/XXX.app/Contents/Resources/app.asar/node_modules/macos-release/index.js:26:26)
at Object.<anonymous> (/Applications/XXX.app/Contents/Resources/app.asar/main/utils/errors.js:54:17)
at Module._compile (internal/modules/cjs/loader.js:968:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:986:10)
at Module.load (internal/modules/cjs/loader.js:816:32)
at Module._load (internal/modules/cjs/loader.js:728:14)
at Module._load (electron/js2c/asar.js:717:26)
at Function.Module._load (electron/js2c/asar.js:717:26)
at Module.require (internal/modules/cjs/loader.js:853:19)
at require (internal/modules/cjs/helpers.js:74:18)
Run Code Online (Sandbox Code Playgroud)

macos cordova ionic-framework

Leo*_*deu
lucky-day
29
推荐指数
6
解决办法
2万
查看次数

如何在Ionic 2 <ion-content>中禁用或隐藏滚动条

我有一个Angular 2应用程序包裹在Ionic 2.我正在使用<ion-tabs>,并在每个选项卡中是一个<ion-content>.此区域中的内容需要可滚动,但Ionic 2添加了一个我不想显示的滚动条.似乎在编译时,<ion-content>有一个<scroll-content>注入其中.我不想要这种行为.

我曾尝试过许多以前在Ionic 1中工作的解决方案,但它们在Ionic 2中不起作用:

  • 设置scroll="false"在<ion-content>
  • 设置scrollbar-y="false"在<ion-content>
  • 设置overflow-scroll="false"在<ion-content>

  • 在css中设置以下内容:

    .scroll-bar-indicator { display: none; }

等等...

设置以下内容实际上可以删除滚动条,但我宁愿不劫持浏览器行为,也会从<ion-content>标签内部的内容中删除滚动条,这是我不想要的.

::-webkit-scrollbar,
*::-webkit-scrollbar {
  display: none;
}
Run Code Online (Sandbox Code Playgroud)

ionic-framework ionic2 angular

vae*_*r-k
lucky-day
28
推荐指数
3
解决办法
4万
查看次数

Cordova/Ionic构建android Gradle错误:支持的最低Gradle版本是2.14.1.当前版本是2.13

这是我想要记录的上述错误的解决方案.我发现了其他类似的帖子,但都没有描述这个错误如何与Cordova或Ionic相关联.

如果您不小心,Android Studio使用的Gradle版本与Cordova/cordova-android在其自动生成的应用程序代码中指定的Gradle版本可能不匹配.如你所知,跑步

$ cordova platform add android
Run Code Online (Sandbox Code Playgroud)

(或者$ ionic platform add android,如果您正在构建Ionic应用程序)在-project/platforms/android上创建本机应用程序代码.

在该文件夹中,文件:/the-project/platforms/android/cordova/lib/builders/GradleBuilder.js导出一个变量,如下所示:

var distributionUrl = process.env['CORDOVA_ANDROID_GRADLE_DISTRIBUTION_URL'] || 'http\\://services.gradle.org/distributions/gradle-x.y-all.zip';
Run Code Online (Sandbox Code Playgroud)

其中x和y取决于使用哪个版本的Cordova/cordova-android来构建本机应用程序代码.

当你跑步

$ cordova build android
Run Code Online (Sandbox Code Playgroud)

distributionUrlvar中指定的Gradle 版本是用于构建的版本.

现在这里是棘手的部分.当您将项目导入Android Studio时,您很可能会收到一条消息,强烈建议您将Gradle升级到更新版本,如下所示:

在此输入图像描述 如果您这样做,Android Studio将下载新版本的Gradle并将其存储在本地并配置项目以使用新下载的本地Gradle分发,这是所选"使用默认等级包装"下方的无线电选项,我最终取消选择,因为这会导致错误.

在此输入图像描述

这将导致问题,因为Android Studio和Cordova现在将尝试使用不同版本的Gradle构建应用程序,您将在Android Studio中获得构建错误,并且 

$ cordova build android
Run Code Online (Sandbox Code Playgroud)

在命令行中.Cordova应用程序的解决方案是始终将Android Studio项目设置为"使用默认gradle包装器"并忽略要升级的诱人消息.如果您确实想使用较新版本的Gradle,则可以随时更改上述文件中的distributionUrl var(但Cordova强烈建议不要修改平台文件夹中的代码,因为它很容易被覆盖).在撰写本文时,我无法分辨是否有办法设置Gradle版本

$ cordova platform add android
Run Code Online (Sandbox Code Playgroud)

步骤,这是你想要这样做,所以你永远不会直接修改项目/平台内的代码

android gradle cordova android-studio ionic-framework

cna*_*ers
lucky-day
28
推荐指数
5
解决办法
3万
查看次数

标签 统计

ionic-framework ×10

cordova ×5

android ×3

angularjs ×3

ionic2 ×3

angular ×2

android-studio ×1

angular-cli ×1

angularjs-ng-repeat ×1

angularjs-routing ×1

dom-events ×1

gradle ×1

grid ×1

ionic ×1

ionic3 ×1

macos ×1

node.js ×1