目前我们的项目使用默认$routeProvider
,我正在使用这个"hack",url
无需重新加载页面即可进行更改:
services.service('$locationEx', ['$location', '$route', '$rootScope', function($location, $route, $rootScope) {
$location.skipReload = function () {
var lastRoute = $route.current;
var un = $rootScope.$on('$locationChangeSuccess', function () {
$route.current = lastRoute;
un();
});
return $location;
};
return $location;
}]);
Run Code Online (Sandbox Code Playgroud)
并在 controller
$locationEx.skipReload().path("/category/" + $scope.model.id).replace();
Run Code Online (Sandbox Code Playgroud)
我想到的替换routeProvider
用ui-router
筑巢路线,但无法找到这ui-router
.
是否有可能 - 做同样的事情angular-ui-router
?
我为什么需要这个?让我用一个例子说明:
用于创建新类是路线/category/new
后clicking
在SAVE我秀success-alert
,我想改变路线/category/new
,以/caterogy/23
(23 -是存储在数据库新项目的ID)
我的单页应用程序加载主页,我想显示一系列想法.每个想法都显示在一个动画flash容器中,动画显示在想法之间循环.
想法使用$ http加载:
$scope.flash = new FlashInterface scope:$scope,location:$location
$http.get("/competition.json")
.success (data) ->
$scope.flash._init data
Run Code Online (Sandbox Code Playgroud)
但是,要从历史导航和UX中受益,我希望更新地址栏以使用$ location显示每个想法的正确URL:
$location.path "/i/#{idea.code}"
$scope.$apply()
Run Code Online (Sandbox Code Playgroud)
我在这里调用$ apply,因为这个事件来自AngularJS上下文,即Flash.我希望保留当前的控制器/视图,并使视图不重新加载.这非常糟糕,因为重新加载视图会导致整个flash对象被抛弃并且预加载器循环再次开始.
我试过听$ routeChangeStart来做一个preventDefault:
$scope.$on "$routeChangeStart", (ev,next,current) ->
ev.preventDefault()
$scope.$on "$routeChangeSuccess", (ev,current) ->
ev.preventDefault()
Run Code Online (Sandbox Code Playgroud)
但无济于事.如果我在改变$ location.path时想出一种覆盖视图重载的方法,那么整个事情就会变得很糟糕.
我仍然非常感觉AngularJS,所以我很高兴有关如何构建应用程序以实现我的目标的任何指示!
我需要能够更改页面的位置哈希(例如从"#/"到"#/ page1"),以便angularjs不会重新加载页面.有可能吗?