那些遇到过的问题

标签: ionic

如何在Ionic的导航栏下面制作一个容器填满整个屏幕？

我想要一个iframe来填充导航栏下方的所有空间.我看到Ionic正在生成内联CSS并向html,body标签添加类,它还创建了div包装器.我不知道达到我想要的目的是什么.我需要为此使用一些预制的CSS类,还是自己编写？如果是这样,我该怎么做,不打破布局.

问题不是关于iframe,而是关于让容器填满导航栏下面的整个空间.

目前iframe占据全宽但只有150像素的高度,因为父容器的高度为150px.

我的应用程序基于(github的标签应用程序).

我的代码如下:

index.html的:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <title></title>
  </head>
  <body ng-app="starter">
    <ion-nav-bar class="bar-stable">
      <ion-nav-back-button>
      </ion-nav-back-button>
    </ion-nav-bar>
    <ion-nav-view style="width: 100%; min-height: 100%; height: 100%;">
        <!-- tab-map is shown here: -->
    </ion-nav-view>
  </body>
</html>
Run Code Online (Sandbox Code Playgroud)

制表map.html:

<ion-view view-title="Map" style="width: 100%; min-height: 100%">
  <div style="width: 100%; min-height: 100%">
    <ion-content class="padding" >
      <iframe src="../index.html" style="width: 100%; min-height: 100%">    
      </iframe>
    </ion-content>
  </div> 
</ion-view>
Run Code Online (Sandbox Code Playgroud)

目前它看起来像这样:

目前它看起来像这样

html cordova ionic-framework ionic

afa*_*f12
2015 01-16
7
推荐指数
2
解决办法
2万
查看次数

Cordova:LocalFileSystem未定义

我无法使cordova文件系统工作.我有一个具有以下依赖项的项目:

com.ionic.keyboard 1.0.3 "Keyboard"
org.apache.cordova.console 0.2.12 "Console"
org.apache.cordova.device 0.2.13 "Device"
org.apache.cordova.file 1.3.2 "File"
org.apache.cordova.file-transfer 0.4.8 "File Transfer"
Run Code Online (Sandbox Code Playgroud)

在app.js我定义对控制器模块的依赖:

angular.module('starter', ['ionic', 'controllers']);
Run Code Online (Sandbox Code Playgroud)

控制器代码基本上是这样的:

angular.module('controllers', [])
  .controller('GalleryCtrl', function ($scope) {
    function success() {...}
    function error() {...}
    window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, success, error);
  }
}
Run Code Online (Sandbox Code Playgroud)

然后我得到的是:

LocalFileSystem is not defined
Run Code Online (Sandbox Code Playgroud)

此外,requestFileSystem未定义.这种行为可能是什么原因？

我使用的是cordova 4.1.2和离子1.3.1.

编辑:这是相应的HTML标记:

<body ng-app="starter" ng-controller="GalleryCtrl">
<ion-nav-view>
    <ion-slide-box id="slideBox">
        <ion-slide ng-repeat="..."> <!-- details omitted -->
        </ion-slide>
    </ion-slide-box>
</ion-nav-view>
</body>
Run Code Online (Sandbox Code Playgroud)

cordova html5-filesystem cordova-plugins ionic

Bas*_*ian
2015 01-17
7
推荐指数
1
解决办法
2万
查看次数

Ionic Framework:Android Emulator无法访问主机上的服务

我正在尝试实现http://ccoenraets.github.io/ionic-tutorial/install-ionic.html上提供的Ionic示例教程.

我能够在Android虚拟设备上部署示例应用程序.但是,该应用程序无法访问笔记本电脑上托管的REST服务.我试图通过将"localhost"更改为"10.0.2.2"来访问该服务.我还在config.xml中添加了以下内容

<access origin="*"/>

有人可以告诉我如何解决这个问题吗？

android ionic-framework ionic

Gur*_*rao
lucky-day
7
推荐指数
1
解决办法
5787
查看次数

离子registerBackButtonAction不起作用

以下是重现的步骤:

  1. 创建一个基本的离子项目"离子启动测试侧面菜单"
  2. 添加android平台"ionic platform add android"

  3. 在app.js中添加代码:

     $ionicPlatform.registerBackButtonAction(function (event) { 
    alert("back button action handler");            
    event.preventDefault(); 
 }, 999);
    Run Code Online (Sandbox Code Playgroud)

    此代码可以添加到.run方法或$ ionicPlatform.ready()方法中 - 相同的结果,不起作用

  4. "离子生成android"然后"离子上传" - >或manualy把apk放在设备上

[BUG] - 未显示警报并执行历史视图导航.这就像我尝试注册的这个动作没有被考虑在内.

我究竟做错了什么？我也在控制器中尝试了这个代码,e.stopPropagation()或e.stopImmediatePropagation仍然没有成功.

我有最新的Ionic(1.4.5)和Cordova 4.3.0,在一些三星设备上测试过.在Ripple它可以正常工作.

android ionic-framework ionic

gmo*_*gan
lucky-day
7
推荐指数
1
解决办法
8458
查看次数

如何检测离子项内元素的点击？

使用ion-list和ion-item,我无法检测到按钮或div等元素的点击.

例如,使用ng-click在此处不起作用:

<ion-list>
      <ion-item ng-repeat="device in devices">
          <div ng-click="deviceOption(device.id)"> CLICK HERE</div>                                            
      </ion-item>
</ion-list>
Run Code Online (Sandbox Code Playgroud)

我尝试过使用ion-option-button,但它并不适合使用.

为什么我们不能用一个简单的离子按钮指令来检测离子项内的点击？

ionic-framework ionic

mat*_*dev
2015 06-24
7
推荐指数
2
解决办法
2万
查看次数

Android Project to Cordova插件 - 找不到/创建了R.java

这实际上是我第一个使用大量设备特性的Cordova插件之一.

上下文

我的android项目由以下部分组成:

  • libs(供应商库,如libGoogleAnalyticsServices.jar或android-support-v4.jar)
  • res(anim/drawable/values/xml ...)
  • src(我的项目Java特定来源)

在android中,一旦项目被编译,就会创建一个特定的文件来处理我的所有项目定义和依赖项:com.myProject.R.java android项目引用了很多R.drawable(例如),因此需要导入com.myProject.R.java

我想将该Android项目用于Cordova插件.

因此,我为我的cordova插件创建了一个全新的目录: - 创建了我的节点界面 - 复制了我的Android Source - 更新了plugin.xml以引用mt文件/ intent ...

什么工作

随着创建的cordova插件,我将它添加到我现有的离子项目中.这个项目使用ANT进行构建,它已经有6个月了,还没有更新到gradle新的构建系统.

我手工复制了日食生成的R.java到ANT-BUILD com/myProject/R.java,我的项目工作正常.

这一步允许我们轻松地将完整的android项目导出到Cordova插件

什么行不通

Ionic已经更新了它的构建过程,现在正在使用Gradle.更新我的android平台后(用cordova平台rm android/cordova平台添加android)

我现在有很多以下错误(其他问题相同): 

platforms\android\build\intermediates\res\debug\layout\main.xml:30: error: Error: No resource found that matches the given name (at 'text' with value '@string/vehicleDetailsDefaultTxt').
Run Code Online (Sandbox Code Playgroud)

此问题与以下事实有关:我com.myProject.R.java没有在gradle构建中创建/生成,并且找不到引用对象.

我试图手动将R.java文件放入:

  • 平台\ android\build\intermediates :(很多不同的目录) - 同样的问题
  • platforms\android\build\generated\source\r\_ debug:这是文件应该是IMO但在打包之前,gradle清理目录

我该如何参考R.java？或者我该如何自动编译R.java？或者更好的是,我如何制作一个Android项目(带有布局/资源...)一个Cordova项目,以便我像以前一样阻止任何手动步骤？

请随时向我询问有关该问题的其他信息.我会尽快回答

android gradle r.java-file cordova ionic

aor*_*vre
2015 07-09
7
推荐指数
0
解决办法
941
查看次数

Android模拟器中的应用程序错误问题"存在网络错误"

我添加平台android运行它后,在Android上运行离子应用程序 

ionic emulate android -l -c
Run Code Online (Sandbox Code Playgroud)

我不知道为什么会这样,它的android清单文件是:

 <?xml version='1.0' encoding='utf-8'?>
<manifest android:hardwareAccelerated="true" android:versionCode="1" android:versionName="0.0.1" package="com.greatdevelopers.hrstop" xmlns:android="http://schemas.android.com/apk/res/android">
    <supports-screens android:anyDensity="true" android:largeScreens="true" android:normalScreens="true" android:resizeable="true" android:smallScreens="true" android:xlargeScreens="true" />
    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
    <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
    <application android:hardwareAccelerated="true" android:icon="@drawable/icon" android:label="@string/app_name" android:supportsRtl="true">
        <activity android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale" android:label="@string/activity_name" android:launchMode="singleTop" android:name="MainActivity" android:screenOrientation="portrait" android:theme="@android:style/Theme.Black.NoTitleBar" android:windowSoftInputMode="adjustResize">
            <intent-filter android:label="@string/launcher_name">
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <activity android:label="@string/multi_app_name" android:name="com.synconset.MultiImageChooserActivity" android:theme="@android:style/Theme.Holo.Light" />
    </application>
    <uses-sdk android:minSdkVersion="10" android:targetSdkVersion="22" />
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
</manifest>
Run Code Online (Sandbox Code Playgroud)

它向我展示了这个问题.任何解决方案请告诉我.

收到错误消息

android http ionic

Man*_*mar
lucky-day
7
推荐指数
1
解决办法
5332
查看次数

Angularjs使用下拉列表过滤数据

我是angularjs和javascript的新人,所以请善待,我有两个下拉项目(离子选择)他们都持有服务数据.问题是我需要过滤它们才能一起工作:如果我在第一个下拉列表中选择一个公司,那么只有该公司内部的代表应显示在另一个下拉列表中.

我| filter: byID在Angularjs文档中尝试使用,但我不认为这是不正确的做法.

HTML:

<label class="item item-input item-select"">
    <div class="input-label">
      Company:
    </div>
    <select>
      <option ng-repeat="x in company">{{x.compname}}</option>
      <option selected>Select</option>      
    </select>
  </label>
   <div class="list">
  <label class="item item-input item-select">
    <div class="input-label">
      Rep:
    </div>
    <select>
       <option ng-repeat="x in represent">{{x.repname}}</option>
      <option selected>Select</option>
    </select>
  </label>
Run Code Online (Sandbox Code Playgroud)

使用Javascript:

/*=========================Get All Companies=========================*/
 $http.get("http://localhost:15021/Service1.svc/GetAllComp")
      .success(function(data) {

        var obj = data;
        var SComp = [];


    angular.forEach(obj, function(index, element) {

    angular.forEach(index, function(indexN, elementN) {        

        SComp.push({compid: indexN.CompID, compname: indexN.CompName});

        $scope.company = SComp;
    });    

    });          
            })
/*=========================Get All Companies=========================*/

/*=========================Get …
Run Code Online (Sandbox Code Playgroud)

javascript angularjs ionic-framework ionic

作者
2015 08-06
7
推荐指数
1
解决办法
3万
查看次数

angularjs中的ui-view和离子中的ion-nav-view之间有什么区别？

正如您所知,ui-router我们使用角度ui-view来渲染html父亲html.根据这个:

<!-- index.html -->
<body>
  <div ui-view="filters"></div>
  <div ui-view="tabledata"></div>
  <div ui-view="graph"></div>
</body>
Run Code Online (Sandbox Code Playgroud)

js 文件:

$stateProvider
  .state('report', {
  views: {
    'filters': { ... templates and/or controllers ... },
    'tabledata': {},
    'graph': {},
  }
})
Run Code Online (Sandbox Code Playgroud)

同样在Ionic框架中我们可以使用:

<ion-nav-view name="filters"></ion-nav-view>
Run Code Online (Sandbox Code Playgroud)

有什么不同？

javascript angularjs angular-ui-router ionic-framework ionic

Vah*_*afi
lucky-day
7
推荐指数
1
解决办法
2891
查看次数

Ionic anchorscroll无法在iOS上运行

我在我的离子应用程序中使用$ anchorscroll,在Android上它运行正常但在iOS上我的内容在滚动后卡住了,我无法向上滚动.

我尝试使用overflow-scroll ="true",但这在我的应用程序中都不起作用...

有人可以帮我这个吗？

function scrollTo() {
    console.log("scroll to: " + $stateParams.id);
    var anchor = '';
    if($stateParams.id === '') {
        console.log("empty");
        anchor = "birthday-test";
    } else {
        console.log("not empty");
        var employee_id = $stateParams.id;
        anchor = "birthday-" + employee_id;
    }
    console.log("anchor : " + anchor);
    $location.hash(anchor);
    $anchorScroll();
}
Run Code Online (Sandbox Code Playgroud)

ios anchor-scroll ionic

War*_*rri
lucky-day
7
推荐指数
1
解决办法
671
查看次数

标签 统计

ionic ×10

ionic-framework ×6

android ×4

cordova ×3

angularjs ×2

javascript ×2

anchor-scroll ×1

angular-ui-router ×1

cordova-plugins ×1

gradle ×1

html ×1

html5-filesystem ×1

http ×1

ios ×1

r.java-file ×1