AngularJS中,一个页面跳转到它自己,应该怎么写
写一个文件夹查看页,那么查看其子文件夹,必然还是要跳转到文件夹查看页,可是路由只有在url发生改变之时才会触发跳转,我试过了在文件夹查看页的路由对应的url加入一个随机数的参数,可是这种方法根本不起作用,后来做成了点击文件夹后只是改变文件夹列表数组的值,不用跳转,可是这样也不能触发页面自动刷新,所以我只能用$window.location.reload(true)这种方法,手动刷新,但是其效果很糟糕,有时候起作用,有时候不起作用,求大神帮忙。
下面是路由,controller,和页面路由
.state('tab.folder-list', {
url: '/folder-list',
views: {
'tab-more': {
templateUrl: "templates/work/folder/folder-list.html",
controller: "folderCtrl"
}
}
})
对应的
controller
页面
appCtrls.controller('folderCtrl', function ($scope, $state, $window, goBackService, $ionicActionSheet, folderService, $stateParams, localStorageService) {
var isr = false;
$scope.getAllFolderList = function () {
var pro = folderService.isRootFolder(localStorageService.getLocalStorage("current").currentFolderId);
pro.then(function (res) {
$scope.isRoot = res.data;
isr = $scope.isRoot;
})
var promise = folderService.getAllFolderList(localStorageService.getLocalStorage("current").currentFolderId);
promise.then(function (response) {
console.debug("List----->>>" + angular.toJson(response.data));
$scope.folderList = response.data.folderList;
$scope.fileList = response.data.fileList;
localStorageService.setLocalStorage("currentFolderList",$scope.folderList);
}, function (response) {
$scope.folderList = [];
$scope.fileList = [];
}
)
//$window.location.reload(true);
}
//currentFolderId:当前目录Id,previousFolderId:当前目录的上级目录id,用于返回到上级目录
//当点击文件夹列表中的文件夹时,会将点击的该文件夹id(跳转后变成当前目录id),以及跳转前的当前目录id(跳转后就变成了上一级目录id)传过去
//根目录与其他目录不同之处,在于根目录不允许删除,编辑
$scope.goToViewFolder = function (folder) {
var current = {
currentFolderId: folder.id,
previousFolderId: localStorageService.getLocalStorage("current").currentFolderId
};
localStorageService.setLocalStorage("current", current);
$scope.isRoot = false;
var promise = folderService.getAllFolderList(localStorageService.getLocalStorage("current").currentFolderId);
promise.then(function (response) {
$scope.folderList = response.data.folderList;
$scope.fileList = response.data.fileList;
localStorageService.setLocalStorage("currentFolderList",$scope.folderList);
}, function (response) {
$scope.folderList = [];
$scope.fileList = [];
}
)
$window.location.reload(true);
/*var now=new Date();
var number = now.getSeconds();
$state.go("tab.folder-list",{random:number},{reload: true});*/
}
$scope.showAdd = function (folder) {
var menuItems = [
{text: "新建文件"},
{text: "新建文件夹"}
];
// Show the action sheet
var hideSheet = $ionicActionSheet.show({
titleText: "",
buttons: menuItems,
buttonClicked: function (index) {
if (index == 1) {
$state.go("tab.folder-add");
} else {
$state.go("tab.file-chooseWayToGainFile");
}
},
cancelText: "取消",
cancel: function () {
// add cancel code..
}
/*,
destructiveText: "删除",
destructiveButtonClicked:function(){
}*/
});
};
//返回上级目录,刷新列表页
$scope.backToPrevious = function () {
var previousFolderId = "";
//console.debug("previousFolderId-->>"+localStorageService.getLocalStorage("current").previousFolderId);
var promise = folderService.getParentFolderId(localStorageService.getLocalStorage("current").previousFolderId);
promise.then(function (res) {
previousFolderId = res.data;
var current = {
currentFolderId: localStorageService.getLocalStorage("current").previousFolderId,
previousFolderId: previousFolderId
};
localStorageService.setLocalStorage("current", current);
})
var pro = folderService.isRootFolder(localStorageService.getLocalStorage("current").currentFolderId);
pro.then(function (res) {
$scope.isRoot = res.data;
isr = $scope.isRoot;
})
var promise = folderService.getAllFolderList(localStorageService.getLocalStorage("current").currentFolderId);
promise.then(function (response) {
$scope.folderList = response.data.folderList;
$scope.fileList = response.data.fileList;
localStorageService.setLocalStorage("currentFolderList",$scope.folderList);
}, function (response) {
$scope.folderList = [];
$scope.fileList = [];
}
)
$window.location.reload(true);
/*var now=new Date();
var number = now.getSeconds();
$state.go("tab.folder-list",{random:number},{reload: true});*/
}
$scope.goToViewFile = function (file) {
$state.go("tab.file-fileView", {fileId: file.id});
}
$scope.editFolder = function () {
$state.go("tab.folder-edit");
}
});
<ion-view view-title="列表">
<ion-nav-buttons side="right">
<a class="button button-clear" ng-click="editFolder()" ng-show=""><i class="icon ion-ios-compose-outline"></i></a>
<a class="button button-clear" ng-click="showAdd()"><i class="icon ion-android-menu"></i></a>
</ion-nav-buttons>
<ion-nav-buttons side="left">
<a ng-show="isRoot" class="button button-clear" ui-sref="tab.file-companysIBelongTo"><i class="icon ion-ios-arrow-left"></i>公司列表</a>
<a ng-show="!isRoot" class="button button-clear" ng-click="backToPrevious()"><i class="icon ion-ios-arrow-left"></i>返回上级目录</a>
</ion-nav-buttons>
<ion-content class="no-padding" ng-init="getAllFolderList()">
<div class="item item-divider">文件夹列表</div>
<div class="list">
<div class="item item-icon-left item-icon-right" ng-repeat="folder in folderList" ng-click="goToViewFolder(folder)">
<i class="icon ion-android-folder"></i>
{{folder.name}}
<i class="icon ion-chevron-right icon-accessory"></i>
</div>
</div>
<div class="item item-divider">文件列表</div>
<div class="list">
<div class="item item-icon-left item-icon-right" ng-repeat="file in fileList" ng-click="goToViewFile(file)">
<i class="icon ion-android-document"></i>
{{file.name}}
<i class="icon ion-chevron-right icon-accessory"></i>
</div>
</div>
</ion-content>
</ion-view>
exalice
9 years, 2 months ago
Answers
http://angular-ui.github.io/ui-router/site/#/api/ui.router.state.directive
:ui-sref
用ui-sref-opts参数
<div ui-sref="{string}" ui-sref-opts="{reload:true}">
...
</div>
面纸面纸面纸
answered 9 years, 2 months ago