标签: ionic

安装了cordova设备插件:

sudo cordova plugin add org.apache.cordova.device

然后下载ngCordova并将ng-cordova.min.js包含在js文件夹中,并包含在index.html中

接下来我做的是注入ngCordova,如下所示

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

然后包含在控制器中如下

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

.controller('AppCtrl', function($scope, $ionicModal, $timeout, $ionicPlatform,$cordovaDevice)
but still getting the following errors

ReferenceError: device is not defined
at Object.getUUID (http://localhost:8100/js/ng-cordova.min.js:1:14929)
at new <anonymous> (http://localhost:8100/js/controllers.js:27:26)
at invoke (http://localhost:8100/lib/ionic/js/ionic.bundle.js:11591:17)
at Object.instantiate (http://localhost:8100/lib/ionic/js/ionic.bundle.js:11602:23)
at http://localhost:8100/lib/ionic/js/ionic.bundle.js:14906:28
at updateView (http://localhost:8100/lib/ionic/js/ionic.bundle.js:42986:30)
at eventHook (http://localhost:8100/lib/ionic/js/ionic.bundle.js:42933:17)
at Scope.$broadcast (http://localhost:8100/lib/ionic/js/ionic.bundle.js:20605:28)
at $state.transition.resolved.then.$state.transition (http://localhost:8100/lib/ionic/js/ionic.bundle.js:34122:22)
at wrappedCallback (http://localhost:8100/lib/ionic/js/ionic.bundle.js:19197:81)

你能告诉我出了什么问题吗？

如果有另一种方法来读取设备UUID向我显示它的方向.

我正在使用Ionic,cordova制作应用程序.我试图将视图的方向限制为仅限肖像,我在config.xml文件中执行以下操作,但它仍然没有任何想法吗？

    <?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<widget id="com.ionicframework.ionicucas805049" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
  <name>ionicUcas</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="*"/>
  <preference name="webviewbounce" value="false"/>
  <preference name="UIWebViewBounce" value="false"/>
  <preference name="DisallowOverscroll" value="true"/>
  <preference name="BackupWebStorage" value="none"/>
  <preference name="Orienation" value="portrait" />
  <feature name="StatusBar">
    <param name="ios-package" value="CDVStatusBar" onload="true"/>
  </feature>
</widget>

我添加了<preference name="Orienation" value="portrait" /> 但没有喜悦....

我使用这个将标题更改为更暗的颜色:

<ion-nav-bar class="bar-royal">

当我在ios上运行它时,顶部的状态栏文本(时间,载体,电池等)是黑色的,很难在深色背景上看到.如何将此文本设为白色？

当我使用Crosswalk(ionic browser add crosswalk; ionic build android)编译APK时,大小太大(~20 MB).我认为使用crosswalk lite会减少编译APK的大小.但是我不知道使用ionic-cli来使用crosswalk lite.

我的问题是:1.这会支持人行横道吗？2.是否有任何黑客(或临时解决方案)使用人行横道精简版？

谢谢.

这里的第一篇文章,但真的很感激一些帮助或建议:

我目前正在使用离子框架构建一个项目,在构建功能版本后,我决定能够在选项卡之间滑动以显示应用程序的各个部分.

我使用离子提供的选项卡模板构建了应用程序,因此每个页面都通过ion-nav-view元素显示,并且是通过app.js文件中声明的状态更改调用的模板(见下文):

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

.run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {
    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
    // for form inputs)
    if (window.cordova && window.cordova.plugins && window.cordova.plugins.Keyboard) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
    }
    if (window.StatusBar) {
      // org.apache.cordova.statusbar required
      StatusBar.styleLightContent();
    }
  });
})

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

  // setup an abstract state for the tabs directive
    .state('tab', {
    url: "/tab",
    abstract: true,
    templateUrl: "templates/tabs.html"
  })

  // Each tab has its own nav history …

我使用Visual Studio 2015 RC创建了一个Ionic(Apache Cordova)应用程序.我在自己的解决方案文件中创建了它,我可以使用Ripple运行它.

现在我想将文件移动到与我的服务器应用程序相同的文件夹中,因此我复制了项目文件夹并将项目添加到另一个解决方案中.如果我现在尝试使用Ripple运行项目,我会收到此错误:

无法获得Ripple会话信息.例外:无法连接到远程服务器.请关闭所有Chrome实例,然后重试.

如何让Ripple再次运行？

我正在使用离子,我有以下观点:

<ion-view hide-nav-bar="true" ng-controller="loginController" class="login-view">
  <ion-content class="padding">

    <div class="row row-center">
      <div class="col">

        <div id="logo"></div>

        <form>
          <div class="list">
            <label class="item item-input">
              <input type="text" placeholder="Membership No" ng-model="membershipNo">
            </label>
            <label class="item item-input">
              <input type="password" placeholder="Password" ng-model="password">
            </label>
          </div>

          <button class="button button-block button-positive button-login" ng-click="login()">
            Login
          </button>
        </form>

      </div>
    </div>

  </ion-content>
</ion-view>

而我的控制器:

app.controller('loginController', ['$scope', '$localstorage',
    function($scope, $localstorage) {

        $scope.membershipNo;
        $scope.password;

        $scope.login = function () {
            console.log("User logged in with membership no: " + $scope.membershipNo +
    "\n and password: " + $scope.password);
        }

    } …

我设法打破了以前工作的Ionic环境版本.例如:我下载演示项目"sidemenu"并运行"ionic platform add android"没有任何问题.当我尝试运行"离子构建"时,我收到以下消息:

$ ionic build
Running command: "c:\Program Files\nodejs\node.exe" h:\git\Absolut\hooks\after_p
repare\010_add_platform_class.js h:/git/myapp add to body class: platform-android
Running command: cmd "/s /c "h:\git\Absolut\platforms\android\cordova\build.bat"
"
[Error: Please install Android target: "android-22".

Hint: Open the SDK manager by running: c:\Users\nicsj\AppData\Local\Android\android-sdk\tools\android.BAT
You will require:
1. "SDK Platform" for android-22
2. "Android SDK Platform-tools (latest)
3. "Android SDK Build-tools" (latest)]
ERROR building one of the platforms: Error: cmd: Command failed with exit code 2

You may not have the required environment or …

我今天升级到最新的Cordova - 5.4.1.iOS上的应用程序保持正常工作,但不适用于Android.所有请求都返回404错误,所以我深入研究了主题,发现我需要"cordova-plugin-whitelist".我安装了它并添加了 <meta http-equiv="Content-Security-Policy" content="default-src * 'unsafe-inline' 'unsafe-eval'">

到index.html的头文件以及<access origin="*" /><allow-navigation href="*"/>config.xml

现在每个对外部世界的请求都返回"net :: ERR_NAME_NOT_RESOLVED"

在AndroidManifest.xml中我有这两行,所以我想这不是Internet访问的问题. <uses-permission android:name="android.permission.INTERNET" /> <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />

我经历了很多与cordova-plugin-whitelist有关的问题,但似乎没什么用

我的config.xml```

<?xml version='1.0' encoding='utf-8'?>
<widget id="app" version="1.1.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>app</name>
    <description>
        A sample Apache Cordova application that responds to the deviceready event.
    </description>
    <author email="dev@cordova.apache.org" href="http://cordova.io">
        Apache Cordova Team
    </author>
    <content src="index.html" />
    <allow-navigation href="*" />
    <platform name="ios">...splash screens and icons</platform>
    <platform name="android">...splash screens and icons</platform>
    <icon src="resources/android/icon/drawable-xhdpi-icon.png" />
    <preference name="SplashScreen" value="screen" />
    <preference …

我正在写一个小型离子应用程序,并有一个问题.我正在使用侧面菜单和标签.我的一个视图中有一个离子滑动盒,当我从左到右擦拭这个幻灯片时,侧面菜单滑出.我已经阅读了离子论坛上的各种相关主题,但没有一个有效.

我已经尝试添加drag-content="false"到各种标签,并添加$ionicSideMenuDelegate.canDragContent(false);到我的控制器.

都没有奏效.我认为这是因为我正在使用侧边菜单,标签中包含选项卡和视图.继承我的代码:

的index.html

    <ion-side-menus>

    <!-- Header bar -->
    <ion-side-menu-content ng-controller="NavCtrl" drag-content="false">
        <ion-nav-bar class="bar-positive">
            <ion-nav-back-button class="button-icon ion-ios7-arrow-back">
            </ion-nav-back-button>
        </ion-nav-bar>

        <!-- Page content -->
        <ion-nav-view drag-content="false" animation="slide-left-right"></ion-nav-view>
    </ion-side-menu-content> 

    <!-- Side menu -->
    <ion-side-menu side="left" class="side-menu">
        <ion-header-bar class="bar bar-header bar-dark">
            <h1 class="title">Menu</h1>
        </ion-header-bar>
        <ion-content has-header="true">

            <div ng-if="authData.twitter" class="logged-in-user item item-avatar">
                <img ng-src="{{authData.twitter.cachedUserProfile.profile_image_url}}"/>
                <h2>Hello, {{authData.twitter.displayName}}</h2>
                <p>Logged in via Twitter</p>
            </div>

            <div ng-if="authData.facebook" class="logged-in-user item item-avatar">
                <img ng-src="{{authData.facebook.cachedUserProfile.picture.data.url}}"/>
                <h2>Hello, {{authData.facebook.displayName}}</h2>
                <p>Logged in via Facebook</p>
            </div>

            <ul class="list">
                <li>
                    <a class="item …