标签: ionic

我目前正在尝试使用我的应用程序实现ngCordova SQLite插件,但尚未生成可行的解决方案.我跟随Nic Raboy的博客文章,了解如何使用Ionic项目将SQLite插件实现为"T",但我仍然收到错误:错误:undefined不是对象(评估'$ window.sqlitePlugin.openDatabase')当我尝试在iOS模拟器中运行应用程序时.

我还验证了ngCordova和插件已加载到我的项目中.

这是我的脚本如何加载到我的项目中的顺序:

<script src="lib/ionic/js/ionic.bundle.js"></script>
<script src="lib/ngCordova/dist/ng-cordova.js"></script>
<script src="cordova.js"></script>
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>

我的代码如下.

app.js

angular.module('whoPaidLast', ['ionic', 'ngCordova', 'whoPaidLast.controllers', 'whoPaidLast.services'])

.run(function($ionicPlatform, $cordovaSQLite) {
    $ionicPlatform.ready(function() {
        if(window.cordova && window.cordova.plugins.Keyboard) {
            cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
        }
        if(window.StatusBar) {
            StatusBar.styleDefault();
        }

        db = $cordovaSQLite.openDB({ name: 'accounts.db' });
        $cordovaSQLite.execute(db, 'CREATE TABLE IF NOT EXISTS accounts (id integer primary key autoincrement, firstname text, lastname text, paid numeric, date text)');
    });
})

controllers.js

angular.module('whoPaidLast.controllers', [])

.controller('DashCtrl', ['$ionicPlatform', '$scope', '$ionicModal', '$ionicActionSheet', '$cordovaSQLite', function …

我正在阅读中的离子教程

http://ccoenraets.github.io/ionic-tutorial/build-ionic-project.html

并在浏览器上运行该应用

ionic serve

并在android中使用

ionic emulate android 

当我按照教程中的说明运行该应用程序时，它在我的chrome浏览器上运行良好，但是当我尝试在模拟器上运行时，我看不到任何数据，它只是带有菜单的空白屏幕。我怀疑它与whilelist有关的问题，并添加了

  <allow-navigation href="*" />

到我的/config.xml文件，但仍然无法使用，我当前的config.xml文件是

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<widget id="com.ionicframework.conference472350" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
  <name>conference</name>
  <description>
        An Ionic Framework and Cordova project.
    </description>
  <author email="hi@ionicframework" href="http://ionicframework.com/">
      Ionic Framework Team
    </author>
  <content src="index.html"/>
  <access origin="*" />
  <allow-intent href="*" />
  <allow-navigation href="*" />
  <preference name="webviewbounce" value="false"/>
  <preference name="UIWebViewBounce" value="false"/>
  <preference name="DisallowOverscroll" value="true"/>
  <preference name="android-minSdkVersion" value="16"/>
  <preference name="BackupWebStorage" value="none"/>
  <preference name="SplashScreen" value="screen"/>
  <preference name="SplashScreenDelay" value="3000"/>
  <feature name="StatusBar">
    <param name="ios-package" value="CDVStatusBar" onload="true"/>
  </feature>
  <platform name="android"> …

我有一个asp.net web api,它已被一个离子应用程序使用.
这个web api有一些需要授权的路由,有些则没有.

无论如何配置web api只是为了被离子应用程序消费？任何帮助,将不胜感激.

谢谢

我正在研究用于android的离子/ cordova web应用程序.我已经构建了它并且它一直在工作到目前为止,直到我从Android Studio将Android SDK更新到r24.3.3,现在,每当我向主机服务器发送请求时,我都会收到'未知的铬错误:0'.

Request是一个GET请求,在XmlHttpRequest和AngularJS的$ http指令上测试.

Access-origin设置为"*"

我的Cordova版本是5.1.1.Android SDK r24.3.3在Android 4.3.3和Android 5.0.1上测试 - 在模拟器和实际设备上都有.

关于可能出现什么问题的任何想法？

我发现这个线程告诉我们如何获取ionicScroll的scroll事件:

http://forum.ionicframework.com/t/ionicscrolldelegate-doesnt-have-a-onscroll-event/19497

$ionicScrollDelegate.getScrollView().onScroll = function () {
    console.log($ionicScrollDelegate.getScrollPosition());
};

但这不起作用.官方文档对此没有任何意义.任何线索？

我正在尝试通过IONIC框架创建一个混合应用程序,该框架显示通过HTML5 Canvas和JS实现的多个移动图形.但是,动画在移动设备中呈现的速度非常慢(即使是那些拥有1GB RAM的移动设备).

我们已经确定并下载了FastCanvas(Cordova/PhoneGap插件).我们按照URL中给出的说明进行操作 - https://github.com/phonegap/phonegap-plugin-fast-canvas.但是在"将FastCanvas添加到您的应用程序"中,当我们来到指令3和4时遇到了障碍,因为我的项目中没有Java文件夹.

url中给出的示例(HTML5 Game)是通过PhoneGap完成的,PhoneGap具有上述文件夹结构,当我们通过Android studio构建时它工作正常.

我们尝试通过Android Studio构建我们的项目(通过离子框架完成)但是,gradle构建系统无法识别框架.请求有人请指导我进一步解决这个问题,因为我很难想出一个解决方案.

注意:我们已经为动画尝试了Canvas,JS,CSS3和wizCanvas插件,但输出相同 - 慢.

我试图在Visual Studio 2015中使用Ripple来调试我的应用程序.我想查看本地存储,但是当我打开开发人员工具时,Chrome关闭,Javascript控制台显示以下错误:

文件'mdha:http://code.ionicframework.com/1.0.0-rc.5/js/ionic.bundle.min.js'的源地图'angular-sanitize.min.js.map' 不可能是由于错误'异常类型'引发了TypeScriptSourceMapReader.SourceMapReadFailedException'而从指定位置读取.源代码地图使用不受支持的格式源地图使用不受支持的格式源地图使用不受支持的格式

我该如何摆脱错误？

编辑

我使用File-> New Project-> Javascript-> Apache Cordova Apps-> Ionic Tabs App创建了一个新项目.我看到了一个对话框:

您的项目使用的TypeScript版本早于Visual Studio当前安装的版本.如果您尝试构建项目,可能会出错.您是否希望我们在项目文件中升级TypeScriptToolsVersion,以便您再次看不到此警告？

回答"否"以及我遇到的问题.回答"是"并且它没有.....所以我想我需要弄清楚如何让Visual Studio再次给我对话,或者弄清楚如何手动更改它....

编辑2 我试过这个:

1. 右键单击项目 - >卸载
2. 再次右键单击 - >编辑MyProject.jsproj
3. 改为<TypeScriptToolsVersion>1.4</TypeScriptToolsVersion>1.6

还没有运气......

编辑3 我刚刚意识到,当我关闭浏览器窗口时,总是会显示关于源图"angular-sanitize.min.js.map"未被读取的消息,而不仅仅是当它崩溃时.所以这个消息可能对这个特定问题没什么帮助.

编辑4 我将我的应用程序复制到使用Ionic Tabs App创建的新工作项目中,我仍然遇到问题.可能是两个不同的根本原因.

使用ionic开发Web应用程序时,使用命令行在iOS模拟器中运行程序非常有用

ionic run ios -l -c -s --target="iPhone-5s"

然后通过选择桌面Safari和开发 - > iOS模拟器,您可以在模拟器上调出应用程序的Web Inspector.一切都很好.

在桌面Safari上,右键单击元素以在Web Inspector中找到它非常有用.有没有办法在iOS模拟器Safari中执行此操作？

我最终将一个可搜索的字符串放入HTML和Ctrl-F中以找到它更麻烦.

我正在使用离子ion-slide-box控制来显示几个图像。每个图像都有不同的高度。我正在努力将这些幻灯片内的图像垂直居中。现在，整个幻灯片都与顶部对齐：

<ion-slide-box>
    <ion-slide>
        <img src="../../img/article1.png">
    </ion-slide>
    <ion-slide>
        <div style="height: 100%">
            <img src="../../img/article111.png">
        </div>
    </ion-slide>
    <ion-slide>
        <img src="../../img/article1111.png">
    </ion-slide>
</ion-slide-box>

我正在使用Ionic Side Menu来制作导航抽屉.一个我的观点使用水平图像滑块.我意识到侧面菜单的水平拖动动作是令人不安的图像滑块.它在浏览器上工作得很好,但在ipad中本机运行时却没有用.

侧面菜单

<ion-side-menus enable-menu-with-back-views="false">
  <ion-side-menu-content> 

    <ion-nav-bar class="bar-stable">
      <ion-nav-back-button>
      </ion-nav-back-button>

      <ion-nav-buttons side="left">
        <button class="button button-icon button-clear ion-navicon" menu-toggle="left">
        </button>
      </ion-nav-buttons>
    </ion-nav-bar>
    <ion-nav-view name="menuContent"></ion-nav-view>
  </ion-side-menu-content>

  <ion-side-menu side="left">
  <ion-header-bar align-title="center" class="bar-positive">
  <div class="buttons">
    <button class="button" ng-click="doSomething()">Welcome,Sumit</button>
  </div>
  <h1 class="title"><img class="title-image" src="http://graph.facebook.com/11545902/picture" width="50" height="50" /></h1>
  </ion-header-bar>
       <ion-content>
      <ion-list>
        <ion-item menu-close href="#/app/home">
          Home
        </ion-item>
        <ion-item menu-close ng-click="login()">
            Login
        </ion-item>
        <ion-item menu-close href="#/app/cakes">
          Cake
        </ion-item>
        <ion-item menu-close href="#/app/gifts">
          Gifts
        </ion-item>
        <ion-item menu-close href="#/app/accessories">
          Accessories
        </ion-item>
      </ion-list>
    </ion-content>
  </ion-side-menu>
</ion-side-menus>

水平滚动器

<ion-view view-title="Dashboard">

    <ion-content ng-controller="HomeCtrl" …