1、删除返回按钮文字

1)可以在app.js进行配置

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

      $ionicConfigProvider.platform.ios.tabs.style('standard');
$ionicConfigProvider.platform.ios.tabs.position('bottom');
$ionicConfigProvider.platform.android.tabs.style('standard');
$ionicConfigProvider.platform.android.tabs.position('standard'); $ionicConfigProvider.platform.ios.navBar.alignTitle('center');
$ionicConfigProvider.platform.android.navBar.alignTitle('center'); $ionicConfigProvider.platform.ios.backButton.previousTitleText('').icon('ion-android-arrow-back');
$ionicConfigProvider.platform.android.backButton.previousTitleText('').icon('ion-ios-arrow-back');

2)如果上面行不通,那么就去改源码 如下所示

打开lib下的ionic.bundle.js

注释掉下面这句代码:

// buttonEle.appendChild(buttonTextEle);
    function hasIconClass(ele) {
return /ion-|icon/.test(ele.className);
} var defaultIcon = $ionicConfig.backButton.icon();
if (!hasIcon && defaultIcon && defaultIcon !== 'none') {
buttonEle.innerHTML = '<i class="icon ' + defaultIcon + '"></i> ' + buttonEle.innerHTML;
buttonEle.className += ' button-clear';
} if (!hasInnerText) {
var buttonTextEle = $document[0].createElement('span');
buttonTextEle.className = 'back-text'; if (!hasButtonText && $ionicConfig.backButton.text()) {
buttonTextEle.innerHTML += '<span class="default-title">' + $ionicConfig.backButton.text() + '</span>';
}
if (!hasPreviousTitle && $ionicConfig.backButton.previousTitleText()) {
buttonTextEle.innerHTML += '<span class="previous-title"></span>';
}
// buttonEle.appendChild(buttonTextEle); }

2、隐藏默认返回按钮

在ion-view标签加上 hide-back-button="true" 即可;

3、自定义Nav两侧的button及Nav的title

1)两侧按钮

//nav左边功能按钮
<ion-nav-buttons side="left">
<button class="button button-clear">
<i class="icon ion-ios-chatbubble-outline"></i>
</button>
</ion-nav-buttons>
//nav右边功能按钮
<ion-nav-buttons side="right">
<button class="button button-clear">
<i class="icon ion-ios-chatbubble-outline"></i>
</button>
</ion-nav-buttons>

2)Nav的title

//ion-nav-title 标签里面的内容随便改
<ion-nav-title>
<h1 class="title"> 购物车</h1>
</ion-nav-title>

ionic 删除返回按钮文字,及自定义nav两侧的按钮和title格式的更多相关文章

  1. Ionic3学习笔记(四)修改返回按钮文字、颜色

    本文为原创文章,转载请标明出处 目录 修改返回按钮文字 修改返回按钮颜色 1. 修改返回按钮文字 参考官网 Ionic API---Config 文档 可在 ./src/app/app.module. ...

  2. Swift - 修改导航栏“返回”按钮文字和图标 /手势冲突解决/响应范围

    iOS11之前 修改导航栏“返回”按钮文字,图标 https://blog.csdn.net/u012701023/article/details/50264265 iOS11 完美解决导航栏按钮偏移 ...

  3. Swift - 修改导航栏“返回”按钮文字,图标

    Swift - 修改导航栏“返回”按钮文字,图标 2015-11-27 09:13发布:hangge浏览:4037   项目中常常会使用 UINavigationController 对各个页面进行导 ...

  4. iOS7 修改导航系统默认返回按钮文字及颜色

    //iOS7 修改系统默认返回按钮文字及颜色 UIBarButtonItem *item = [[UIBarButtonItem alloc] initWithTitle:@"返" ...

  5. iOS 设置导航栏 返回按钮文字隐藏

    //隐藏返回按钮文字 [[UIBarButtonItem appearance] setBackButtonTitlePositionAdjustment:UIOffsetMake(0, -60) f ...

  6. 【转】自定义iOS的Back按钮(backBarButtonItem)和pop交互手势(interactivepopgesturerecognizer) --- 不错

    原文网址:http://blog.csdn.net/joonsheng/article/details/41362499 序 说到自定义UINavigetionController的返回按钮,iOS7 ...

  7. 如何得到自定义UITableViewCell中的按钮所在的cell的indexPath.row

    在自定义UITableViewCell中创建了一个按钮. 想在点击该按钮时知道该按钮所在的cell在TableView中的行数.就是cell的 indexPath.row两种方法都很好.-(IBAct ...

  8. 自定义jQuery Mobile工具栏按钮

    自定义jQuery Mobile工具栏按钮 1.实现效果

  9. Spring Cloud实战: 基于Spring Cloud Gateway + vue-element-admin 实现的RBAC权限管理系统,实现网关对RESTful接口方法权限和自定义Vue指令对按钮权限的细粒度控制

    一. 前言 信我的哈,明天过年. 这应该是农历年前的关于开源项目 的最后一篇文章了. 有来商城 是基于 Spring Cloud OAuth2 + Spring Cloud Gateway + JWT ...

随机推荐

  1. 整合SSM框架必备基础—SpringMVC(下)

    在上一篇文章<整合SSM框架必备基础-SpringMVC(上)>中,胖达介绍了关于SpringMVC的诞生.优势以及执行流程等理论知识点,这篇文章打算在实操中加深一下对SpringMVC的 ...

  2. PHP--仿微信, 通过登陆者用户名显示好友列表,显示头像和昵称

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. Java简单公式计算器

    最近给公司开发业务代码时,碰到一个场景,简单描述是这样的: 客户要向咱们公司定制一件产品,这个产品呢,有很多属性,那公司得根据这些属性报价呀,怎么报价呢?公司针对某种类型的产品有一个基准价,在同类产品 ...

  4. Java中返回值定义为int类型的 方法return 1返回的是int还是Integer&&finally中return问题

    在Java中返回值定义为int类型的 方法return 1:中返回的是Integer值,在返回的时候基本类型值1被封装为Integer类型. 定义一个Test类,在异常处理try中和finally中分 ...

  5. 2048 控制台版(C#)

    开篇 2048游戏现在很火啊,很多人应该已经玩过了.在博客园上也看见有人模仿做的GDI+版 2048游戏,鄙人暂且不做那么多动画的东西,毕竟是个小东东,在此奉上一个<控制台版2048>. ...

  6. spring与actionMQ整合

    出处:http://www.cnblogs.com/leiOOlei/p/5075402.html 一.配置部分 ActiveMQ的安装这就不说了,很简单, 这个例子采用maven构建,首先看一下po ...

  7. ES 22 - Elasticsearch中如何进行日期(数值)范围查询

    目录 1 范围查询的符号 2 数值范围查询 3 时间范围查询 3.1 简单查询示例 3.2 关于时间的数学表达式(date-math) 3.3 关于时间的四舍五入 4 日期格式化范围查询(format ...

  8. 搭建PowerDNS+LAP+NFS+MySQL主从半节点同步实现LAMP架构

    实验环境:(共7台机器) PowerDNS: 192.168.99.110    两台LAP: 192.168.99.120 和 192.168.99.130 NFS服务器:192.168.99.14 ...

  9. openGL基本概念

    OpenGL自身是一个巨大的状态机(State Machine):一系列的变量描述OpenGL此刻应当如何运行.OpenGL的状态通常被称为OpenGL上下文(Context).我们通常使用如下途径去 ...

  10. Java经典编程题

    [程序1]   题目:古典问题:有一对兔子,从出生后第3个月起每个月都生一对兔子,小兔子长到第三个月后每个月又生一对兔子,假如兔子都不死,问每个月的兔子总数为多少?   //这是一个菲波拉契数列问题p ...