标签: ionic

bootstrap和Ionic之间的差异

我读了这篇文章离子框架在哪里适合,并试图找出Ionic和bootstrap之间的差异.据我所知,它们有着非常相似的目标:它们使开发Web应用程序变得更容易,为css,js和html提供了许多优秀的设计模式和工具.

据我所知,Ionic更倾向于移动混合原生应用程序,而bootstrap更倾向于基于浏览器的应用程序,我是否正确?但话说回来,Ionic本身无法将html转换为移动本机应用程序,它需要cordova才能实现.那么,离子适合哪里?它与bootstrap有何不同?此外,Ionic需要angularJS才能最大限度地利用它.你只能在没有AngularJS的情况下使用Ionic的CSS部分.所以如果你不想在你的项目中使用angularJS,那么可以说,你最好使用bootstrap和cordova吗?我所理解的是,twitter引导程序在常规网站中也被大量使用,以便为PC浏览器提供良好的界面,因此目标不仅仅是让它在智能手机或平板电脑上看起来很好.

可能是这样,Ionic更适合在手机原生的混合应用程序中提供移动感受吗?只有cordova和bootstrap,人们无法达到同样的目标,至少同样容易?因此,使用bootstrap,您可以更轻松地获得浏览器应用程序的原生感觉,但对于本机混合移动应用程序来说却不那么容易?

我知道这个问题可能是基于意见的,但请不要关闭它,我想了解差异和最佳用例.在哪些情况下使用bootstrap可能更好,在哪种情况下Ionic会更好?如果它们可以相互补充,那么使用它们会有任何意义吗?

twitter-bootstrap angularjs cordova ionic

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

如何让我的Ionic按钮刷新所有离子视图.(大多数情况下只需重新评估ng-switch)

在我看来,我有一个ng-switch喜欢:

<div ng-switch on="team.isFavorite">
    <button class="button button-energized snbutton" ng-switch-when="false" ng-click="makeTeamFavorite()">
      Show team on dashboard
    </button>
    <p class="snmsg" ng-switch-default>
      This team is shown on the dashboard
    </p>
</div>
Run Code Online (Sandbox Code Playgroud)

如何让我的Ionic按钮刷新所有离子视图.在大多数情况下,
最好只重新评估a ng-switch,在1重新加载一切)

我在我的控制器中尝试了什么:

.controller('List-PeopleCtrl', function($ionicHistory, $state, $scope, $stateParams, Teams) {
  $scope.makeTeamFavorite = function() {
      Teams.setFavoriteId($stateParams.teamId);
      $ionicHistory.clearCache();
      $state.go($state.current);
  }
  $scope.team = Teams.get($stateParams.teamId);
  $scope.team.isFavorite = Teams.getFavoriteId()==$stateParams.teamId;
  $scope.people = Teams.members($stateParams.teamId);
})
Run Code Online (Sandbox Code Playgroud)

它会使我猜的所有缓存无效,但它无论如何都不起作用:D

注意

  • 我搜索但没有找到任何可以做到这一点..
  • 我不想用我的离子视图标记cache=false并选择退出所有缓存
  • 认为这是离子特异性的,但可能是我对AngularJS缺乏了解:D
  • 关键是当我再次打开视图时它可以工作(没有清除缓存)..只是在看到它时没有重新加载

编辑:我也试过:

      $ionicHistory.clearCache();
      $state.go($state.current, {}, { reload: true });      
Run Code Online (Sandbox Code Playgroud)

要不就

      $state.go($state.current, …
Run Code Online (Sandbox Code Playgroud)

html javascript angularjs angular-ui-router ionic

19
推荐指数
1
解决办法
2913
查看次数

是否可以使用$ ionicPopup.confirm()更改按钮的文本?

我正在使用$ ionicPopup.confirm()但我想更改"取消按钮"文本.有可能这样做吗?

我知道.show()语法:

  buttons: [
  { text: 'Cancel' }
  ]
Run Code Online (Sandbox Code Playgroud)

但它似乎不适用于.confirm()......

感谢4的帮助

ionic-framework ionic ionic-popup

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

Cordova插件白名单失败要求cordova ios 4

我试着跑

ionic platform ios android
Run Code Online (Sandbox Code Playgroud)

它今天给了我这个错误(它之前工作正常)

Installing "cordova-plugin-whitelist" for ios
Failed to install 'cordova-plugin-whitelist':CordovaError: Plugin doesn't support this project's cordova-ios version. cordova-ios: 3.8.0, failed version requirement: >=4.0.0-dev
    at checkEngines (/usr/local/lib/node_modules/cordova/node_modules/cordova-lib/src/plugman/install.js:116:29)
    at /usr/local/lib/node_modules/cordova/node_modules/cordova-lib/src/plugman/install.js:289:16
    at _fulfilled (/usr/local/lib/node_modules/cordova/node_modules/q/q.js:787:54)
    at self.promiseDispatch.done (/usr/local/lib/node_modules/cordova/node_modules/q/q.js:816:30)
    at Promise.promise.promiseDispatch (/usr/local/lib/node_modules/cordova/node_modules/q/q.js:749:13)
    at /usr/local/lib/node_modules/cordova/node_modules/q/q.js:557:44
    at flush (/usr/local/lib/node_modules/cordova/node_modules/q/q.js:108:17)
    at process._tickCallback (node.js:355:11)
Plugin doesn't support this project's cordova-ios version. cordova-ios: 3.8.0, failed version requirement: >=4.0.0-dev
Run Code Online (Sandbox Code Playgroud)

android ios cordova ionic-framework ionic

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

离子中心文本在屏幕上垂直和水平

我正试着在屏幕上垂直对齐我的文字.我已经阅读有关如何执行此操作的文档.但我还没有运气.这是我的代码:

<div class="row">
  <div class="col col-center text-center">
    <h4 class="gray">This text is in the center of the screen</h4>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

ionic-framework ionic

19
推荐指数
3
解决办法
5万
查看次数

ionic update-notifier-cordova.json'您无权访问此文件

我试图在iOS上运行ionic,但它会抛出错误.

发生了什么?

ionic run ios
    /usr/local/lib/node_modules/cordova/node_modules/update-notifier/node_modules/configstore/index.js:53
                    throw err;
                          ^
    Error: EACCES, permission denied '/Users/jiahongl/.config/configstore/update-notifier-cordova.json'
    You don't have access to this file.

        at Error (native)
        at Object.fs.openSync (fs.js:500:18)
        at Object.fs.readFileSync (fs.js:352:15)
        at Object.create.all.get (/usr/local/lib/node_modules/cordova/node_modules/update-notifier/node_modules/configstore/index.js:34:26)
        at Object.Configstore (/usr/local/lib/node_modules/cordova/node_modules/update-notifier/node_modules/configstore/index.js:27:44)
        at new UpdateNotifier (/usr/local/lib/node_modules/cordova/node_modules/update-notifier/index.js:34:17)
        at module.exports (/usr/local/lib/node_modules/cordova/node_modules/update-notifier/index.js:123:23)
        at checkForUpdates (/usr/local/lib/node_modules/cordova/src/cli.js:64:20)
        at cli (/usr/local/lib/node_modules/cordova/src/cli.js:114:5)
        at Object.<anonymous> (/usr/local/lib/node_modules/cordova/bin/cordova:41:1)
Run Code Online (Sandbox Code Playgroud)

错误信息

android ios angularjs cordova ionic

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

隐藏在离子,angularjs中的按钮

我需要在不同的页面/视图中显示和隐藏后退按钮.我从Justin Noel那里得到了参考:

<body ng-app="starter" ng-controller="AppCtrl">
  <ion-nav-bar class="bar-stable">
    <ion-nav-back-button hide-back-button="{{hideBackButton}}">
    </ion-nav-back-button>
  </ion-nav-bar>
</body>
Run Code Online (Sandbox Code Playgroud)

App控制器切换按钮显示:

.controller('AppCtrl', function($scope, $location) {
   var path = $location.path();
   if (path.indexOf('submit') != -1)
     $scope.hideBackButton = true;
   else
     $scope.hideBackButton = false;
})
Run Code Online (Sandbox Code Playgroud)

但这不起作用,因为控制器只被调用一次,而不是在不同状态下的视图变化.同时从其他控制器(链接到不同状态)更改$ scope.hideBackButton的值对按钮显示没有任何影响.

任何人都可以告诉我如何在每个导航上切换后退按钮显示.我在这里错过了什么?

angularjs ionic

18
推荐指数
3
解决办法
4万
查看次数

离子:已安装的Android应用程序中的缓慢转换

我在Android(Lollipop)设备上安装了一个Ionic app(beta 14),使用:

ionic platform add android
ionic run android
Run Code Online (Sandbox Code Playgroud)

我还手动构建了应用程序并使用adb安装它.

该应用程序使用离子侧菜单,简单视图(列表 - >详细信息 - >详细信息)之间过渡的动画在功能强大的手机上非常滞后.侧面菜单滑出时的动画相当平滑.

为了进一步调查这种情况,我从我的开发机器上提供了www目录,并在手机上的Chrome中打开了该页面,它就像人们期望的那样顺利.该应用程序也可以在iOS设备上顺利运行.

当应用程序处于离子状态时,有没有人知道为什么它如此缓慢,但是当它只是在浏览器中呈现时会按预期执行?

performance android angularjs ionic-framework ionic

18
推荐指数
1
解决办法
6703
查看次数

没有代理的npm ECONNRESET无法安装任何东西

我使用node.js通过npm安装一些东西没有任何问题.现在我没有改变我的设置(Win8;没有代理,互联网工作),我无法安装任何东西(特别是cordova和离子).它只会抛出像我在代理背后的错误,但我不是.

npm ERR! Windows_NT 6.3.9600
npm ERR! argv "C:\\Program Files\\nodejs\\\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "install" "i" "-g" "ionic"
npm ERR! node v0.12.1
npm ERR! npm  v2.5.1
npm ERR! code ECONNRESET
npm ERR! errno ECONNRESET
npm ERR! syscall read

npm ERR! network read ECONNRESET
npm ERR! network This is most likely not a problem with npm itself
npm ERR! network and is related to network connectivity.
npm ERR! network In most cases you are behind a proxy or have bad network settings.
npm …
Run Code Online (Sandbox Code Playgroud)

proxy node.js npm cordova ionic

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

仅适用于Android的Cordova错误:com.android.dex.DexException:多个dex文件定义Landroid/support/annotation/AnimRes;

关于这个问题,我跟着另外三个资源,但都没有用.

我的iOS构建完美,但无论我尝试改变什么,android都会出现此错误.

  • 已经尝试创建一个新项目,但android保持相同的问题.
  • 已安装所有Android SDK

以下是错误:

FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':dexDebug'.
> com.android.ide.common.internal.LoggedErrorException: Failed to run command:
  	/Users/sakai/Library/Android/sdk/build-tools/23.0.1/dx --dex --no-optimize --output /Users/sakai/mobile/cupomap/platforms/android/build/intermediates/dex/debug --input-list=/Users/sakai/mobile/cupomap/platforms/android/build/intermediates/tmp/dex/debug/inputList.txt
  Error Code:
  	2
  Output:
  	
  	UNEXPECTED TOP-LEVEL EXCEPTION:
  	com.android.dex.DexException: Multiple dex files define Landroid/support/annotation/AnimRes;
  		at com.android.dx.merge.DexMerger.readSortableTypes(DexMerger.java:596)
  		at com.android.dx.merge.DexMerger.getSortedTypes(DexMerger.java:554)
  		at com.android.dx.merge.DexMerger.mergeClassDefs(DexMerger.java:535)
  		at com.android.dx.merge.DexMerger.mergeDexes(DexMerger.java:171)
  		at com.android.dx.merge.DexMerger.merge(DexMerger.java:189)
  		at com.android.dx.command.dexer.Main.mergeLibraryDexBuffers(Main.java:502)
  		at com.android.dx.command.dexer.Main.runMonoDex(Main.java:334)
  		at com.android.dx.command.dexer.Main.run(Main.java:277)
  		at com.android.dx.command.dexer.Main.main(Main.java:245)
  		at com.android.dx.command.Main.main(Main.java:106)
  	


* Try:
Run with --stacktrace option to get the stack trace. Run with --info …
Run Code Online (Sandbox Code Playgroud)

android cordova ionic

18
推荐指数
1
解决办法
9326
查看次数