ionic结合angularjs实现跳转到上个页面的功能

虽然ionic已经出来很长一段时间了,但网上的资料依然很少,最近项目中有个很简单的功能要实现,就是返回上个页面,看了一些例子,但都不理想,最简单的一个方法是通过$ionicHistory.goBack();的方法来返回上一页,但用下来发现会有问题,常常挑错页面,于是自己研究了一个方法,效果还不错,和大家分享一下。


1.首先是页面,在头上加个返回按钮,代码如下

<ion-view>
    <ion-nav-title>
       
    </ion-nav-title>

    <ion-nav-buttons side="left">
        <button class="button button-icon icon ion-ios-arrow-back" ng-click="goBack()"></button>
    </ion-nav-buttons>

    <ion-content>

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

2.增加一个$cacheFactory用来保存url地址

    .factory('pageCache',function($cacheFactory){
        return $cacheFactory('page');
    })

3.写一个保存url的方法,再写一个跳转页面的方法

    .factory('commonFactory',function(pageCache,$location){
        return{
            backUrl:function(url){
                pageCache.put('url',url);//这个用来保存页面
            },

            goBack:function(){
                $location.path(pageCache.get('url'));//这个用来跳转页面
            }
        }
    })

4.第一个页面的controller在页面加载的时候就把当前的url保存下来

.controller('carController', function ($scope,$location,commonFactory) {

        $scope.$on('$ionicView.beforeEnter',function(){

            commonFactory.backUrl($location.url());//保存当前页面的url
          
        })

    })

5.第二个页面,要返回的时候只要调用goBack()方法就可以了

   .controller('mapController', function ($scope,commonFactory) {

        $scope.goBack=function(){
            commonFactory.goBack();
        };

    })


这里只提供一个思路,懂ionic和angularjs的人一看就懂,初学者的话,先看看angularjs的基本语法,有不懂的可以回帖提问。



















  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
Ionic中,你可以使用`File`插件来处理文件操作。要复制文件并将其保存到新目录,可以按照以下步骤进行操作: 1. 导入`File`插件 在你的Ionic项目中,运行以下命令来安装`File`插件: ``` ionic cordova plugin add cordova-plugin-file npm install @ionic-native/file ``` 在需要使用`File`插件的组件中导入它: ``` import { File } from '@ionic-native/file/ngx'; ``` 2. 复制文件到新目录 使用`File`插件的`copyFile()`方法来复制文件。该方法需要四个参数: - 原始文件路径 - 原始文件名 - 目标目录路径 - 目标文件名 以下是一个示例代码,可以将`/src/assets/file.txt`文件复制到`/src/assets/copy`目录中的`copy.txt`文件中: ``` import { File } from '@ionic-native/file/ngx'; constructor(private file: File) {} // 复制文件到新目录 copyFile() { const sourceFilePath = this.file.applicationDirectory + 'www/assets/file.txt'; const sourceFileName = 'file.txt'; const targetDirPath = this.file.applicationDirectory + 'www/assets/copy'; const targetFileName = 'copy.txt'; this.file.checkDir(this.file.applicationDirectory, 'www/assets/copy') .then(() => { console.log('目录已存在'); this.file.copyFile(sourceFilePath, sourceFileName, targetDirPath, targetFileName) .then(() => console.log('文件已复制')) .catch(err => console.log('文件复制失败:', err)); }) .catch(() => { console.log('目录不存在'); this.file.createDir(this.file.applicationDirectory + 'www/assets', 'copy', false) .then(() => { console.log('目录已创建'); this.file.copyFile(sourceFilePath, sourceFileName, targetDirPath, targetFileName) .then(() => console.log('文件已复制')) .catch(err => console.log('文件复制失败:', err)); }) .catch(err => console.log('目录创建失败:', err)); }); } ``` 在上面的示例代码中,我们首先检查目标目录是否已存在,如果目录存在,则直接复制文件。如果目录不存在,则先创建目录,然后再复制文件。 注意,在使用`File`插件时,需要在`config.xml`文件中添加以下配置: ``` <platform name="android"> <allow-intent href="market:*" /> <allow-intent href="geo:*" /> <allow-intent href="mailto:*" /> <allow-intent href="sms:*" /> <allow-intent href="tel:*" /> <allow-intent href="http:*" /> <allow-intent href="https:*" /> <allow-intent href="cdvfile:*" /> </platform> ``` 这样就可以实现Ionic中复制文件并保存到新目录了。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值