Ionic 分类 - 来哩HO

Ionic 输入法显示【搜索】按钮

llh 2016/09/28 2,646 1

有3点需要注意的是： 1、input 的 type 设置为：search； 2、必须使用 form 把 input 包裹； 3、form 必须设置属性 action。 <form action=”” ng-submit=”search …

Angularjs Ionic 拖拽排序插件

llh 2016/08/26 2,676 0

Github: https://github.com/kamilkp/angular-sortable-view 演示： http://kamilkp.github.io/angular-sortable-view/#?tab=3 Gith …

Ionic 冻结滚动条禁止页面滚动 $ionicScrollDelegate.freezeScroll()

llh 2016/08/25 2,146 0

用于触屏给元素重新排序时的 ion-content 里有滚动条出现，影响效果。使用如下语句禁止页面滚动： $ionicScrollDelegate.freezeScroll(true)；禁止解除： $ionicScrollDelegat …

Ionic ion-content 里设置元素 fixed （固定）定位失效随滚动条滚动

llh 2016/08/18 2,390 0

解决办法很简单，把需要浮动（ position: fixed;）的元素放到 <ion-content>…</ion-content> 以外即可。如果把浮动元素放在 ion-content 里，fixed …

Ionic 在指定页面里隐藏选项卡 ion-tabs hideTabs

llh 2016/08/17 1,692 0

在一些特定的页面里，例如搜索页面或产品详细页，我们可能不需要底部的选项卡，那么应该如何隐藏它呢？一开始我的做法是： <ion-view hide-tabs> …… </ion-view> …

AngularJS Ionic 使用 ui-sref 和 $state.go 跳转传递参数

llh 2016/07/26 2,373 0

有一些页面我们是需要参数的，例如产品页就可能需要产品 id 什么的信息等。一般情况下我们可以在 url 链接后边直接加入参数，例如（参数“:proId”）： <a ng-repeat=”pro in pros” href=”#/tab …

Ionic 视图 ionicView 的生命周期及事件集

llh 2016/07/07 2,373 0

ionicView 生命周期相关事件的调用，对于我们处理一些当页面切换需要实现的效果十分有用。在 ionicView 对应的 controller 里使用 $scope.$on(‘$ionicView.enter‘ …

AngularJS Ionic ng-repeat 循环中使用 track by 解决 Error: [ngRepeat:dupes] 报错

llh 2016/07/06 2,111 0

使用循环 ng-repeat 的时候报如下错误： Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use ‘track by’ ex …

Ionic AngularJS ng-class 的使用

llh 2016/07/05 2,135 0

AngularJS ng-class 指令的值可以是字符串，对象，或一个数组。使用方法： 1、如果是字符串，多个类名使用空格分隔。 <div ng-class=”class1 class2″>&#823 …

Ionic SCSS 通过 ionic.app.scss 修改默认样式

llh 2016/07/04 2,448 0

首先，你需要下载一个 SCSS 文件的编译软件，这里使用的是 Koala。接着当然是使用 Koala 关联我们的文件：根目录/scss/ionic.app.scss，修改后生成的 ionic.app.css 文件默认是在同目录下。然后需 …

Ionic AngularJS WP Rest API 获取 WordPress 文章评论数据

llh 2016/07/01 2,662 0

整合 Ionic 和 WordPress，我们使用 WP Rest API 来进行数据操作，而 WP Rest API （v2版本）获取文章数据的路径是：你的网站域名/wp-json/wp/v2/comments?post=1&p …

Angularjs Ionic 翻译控制器 controller 里的字符串

llh 2016/06/27 3,226 4

当我们对 Ionic 进行多语言设置后，就要对各个部分的语言进行手动翻译工作。之前讲的翻译主要针对 .html 里的字符串，而事实上，有不少字符串是在我们的 js 加入的，例如控制器 controller 里边添加的（多见于弹出框、确认框、 …

Ionic Slide Box (ion-slides) 整合了 JS 插件 Swiper

llh 2016/06/23 3,089 0

之前介绍了如何在 Ionic 里使用 Swiper JS 插件来更好的展示 Slider，详见： Ionic 中使用 Swiper.js 实现导航标题栏Slider滑动效果事实上，在 Ionic 1 最新的版本包括 Ionic 1.3.1 …

AngularJS Ionic 使用 limitTo 过滤器在 ng-repeat 里来限制字符串输出长度并添加省略号

llh 2016/06/21 3,590 0

AngularJS 可以使用 limitTo 过滤器用来截取数组或字符串，接收一个参数用来指定截取的长度，如果参数是负值，则从数组尾部开始截取。 HTML 使用： {{ limitTo_expression | limitTo : limi …

Ionic AngularJS 国际化多语言支持实现不同语言间切换

llh 2016/06/14 4,922 0

现在互联网产品越来越国际化了，给项目添加英文或其他语言的切换功能相当有必要，在 Ionic 下实现不同语言切换功能，以下一步步来教你实现。首先，打开 cmd 命令行界面并进入项目目录，通过命令安装 angular 插件： bower in …

AngularJS 在 Ionic 项目中使用 jQuery 库

llh 2016/06/08 4,221 0

如果习惯了使用 jQuery，一开始使用 AngularJS 肯定有很多不习惯，特别是要写原生的 Javascript 代码来实现各种功能的时候。如何把 jQuery 也在 Ionic 使用？首先，导入 jQuery 库的时候要把它放在 …

Ionic 使用 ion-nav-bar 改变导航栏 Header 的背景色

llh 2016/06/07 4,621 0

一般情况下，<ion-nav-bar class=”bar-positive”></ion-nav-bar> 会放在 index.html 里，这样其他的页面也会显示头部。如果我们想特定的页面 …

Ionic 中使用 Swiper.js 实现导航标题栏Slider滑动效果

llh 2016/06/05 4,359 0

无论是Web网页端还是移动端，有一个我们超高频率使用到的功能，那就是图片滑动，我们称之为 Slider。在 Ionic 中，有个自带的 ion-slide-box 可以供我们使用，不过它使用的形式有限，或者说过于简单，不能完全满足我们对页面 …

Ionic 用 angular 指令监听循环 ng-repeat 渲染结束后执行脚本

llh 2016/05/31 4,105 0

有时我们会用到类似 slider 的 js 插件来美化界面，然而，slider 的初始化前，需要用到的html渲染完毕才能起作用。这个时候我们需要做的就是在 slide 渲染完毕后再初始化 slider 脚本，使得 slider 正常工作。 …

Ionic 使用 expose-aside-when 属性来控制侧边栏在指定的分辨率屏幕下默认打开

llh 2016/05/30 3,472 0

默认情况下，Side Menus 是关闭状态的，向左或向右滑动的时候才显示。然而，我们可以通过设置 expose-aside-when 这个属性来控制侧边栏在指定的分辨率屏幕下默认打开。例如 Side Menus 我们可以这么写： &lt …

Ionic menu-close 点击菜单时关闭侧边栏

llh 2016/05/29 3,576 0

一开始给 ion-side-menu 添加自定义页面的链接 ion-item 的时候，点击 ion-item 虽然页面有切换，但是 side menu 却没有关闭，还以为自定义的页面需要继承 tab 才可以点击的时候触发关闭 side …

AngularJS 根作用域 $rootScope

llh 2016/05/27 3,821 0

所有的应用都有一个 $rootScope，它可以作用在 ng-app 指令包含的所有 HTML 元素中。 $rootScope 可作用于整个应用中。是各个 controller 中 scope 的桥梁。用 rootscope 定义的值，可以 …