考虑一下代码:
var myApp = angular.module('myApp', []);
路线:
myApp.config(['$routeProvider', function($routeProvider) {
$routeProvider.when('/', {
templateUrl: 'app.html',
controller:myAppController,
resolve:{
resolveData:function(Resolver){
return Resolver();
}
}
});
});
解决:
myApp.factory('Resolver', ['$http', function($http){
return function(){
return $http({url: '/someurl',method: "GET"}).then(function(data) {
// dependent call 1
$http({url: '/someotherurl',method: "GET" }).then(function(data) {
});
// dependent call 2
$http({url: '/someanotherurl',method: "GET" }).then(function(data) {
});
});
}
}]);
上面我在一个内嵌了2个调用,因为它们依赖于父调用返回的数据.
我想做什么:当所有这些都完成后返回解析器,而不仅仅是父调用.
我不能使用$ q.all(),因为其中2个调用依赖于第一个调用.
简而言之,只有在所有3个调用完成后才能加载myAppController.
我正在开发一个应用程序,我必须从详细信息页面插入主页面的后导航链接.两种视图的控制器都不同.我$location.path('/')用来导航回主页面.问题是,当我通过点击此链接向后导航时,我的主页面控制器被重新初始化,这不是预期的行为.有没有办法防止在路由回同一链路时重新初始化控制器.
我收到一个错误记录到控制台:
GET http://localhost:3000/js/lib/angular/MINERR_ASSET 404 (Not Found)
我看到了这篇文章,它说这是不包含ngRoute模块的结果,但我做到了!
公共/ JS/app.js:
window.app = angular.module('mean-blog-seed', ['ngCookies', 'ngResource', 'ui.bootstrap', 'ngRoute', 'mean-blog-seed.controllers', 'mean-blog-seed.services']);
然后我有一个引用angular-route.js的玉文件:
script(type='text/javascript', src='js/lib/angular/angular.min.js')
script(type='text/javascript', src='js/lib/angular-route/angular-route.min.js')
script(type='text/javascript', src='js/lib/angular-cookies/angular-cookies.min.js')
script(type='text/javascript', src='js/lib/angular-resource/angular-resource.min.js')
script(type='text/javascript', src='js/lib/angular-bootstrap/ui-bootstrap-tpls.min.js')
script(src='js/app.js')
script(src='js/config.js')
script(src='js/services/global.js')
script(src='js/controllers/posts.js')
script(src='js/controllers/header.js')
script(src='js/filters.js')
script(src='js/directives.js')
回购在这里
更新: 我在github上发布了这个问题并引用了这个疯狂的答案:https://github.com/angular/angular.js/issues/4675
ng-closure-runner在编译期间运行角度特定传递,其中添加了MINERR_ASSET的定义,该资产不包含在任何1.2.x版本中(包含源映射的唯一版本).但是,源映射引用MINERR_ASSET作为源,因此在请求文件时有404.
我只是快速浏览了咕噜咕噜的任务以及ng-closure-runner,但我认为这可能是ng-closure-runner包括minErr.js或基于它生成的一些文件.无论哪种方式,正确的资产都应该与其他源文件一起打包,或者MINERR_ASSET应该从源地图"sources"中删除.
我有3页:
使用ngRoute模块设置AngularJS以导航我的页面.
默认加载并设置PHP $ _SESSION变量.
回声$ _SESSION的内容.
我使用与ngRoute建立链接从login.php导航到display.php.
无论我导航到多少次,display.php都不会显示$ _SESSION变量.如果我手动导航到页面,例如刷新页面或在浏览器中输入地址,它将仅显示它们.
我知道php代码已执行,因为我可以回显其他东西到屏幕上它只是不访问$ _SESSION变量.
为什么是这样？
我有以下配置:
$routeProvider
.when('/cars', { templateUrl: 'app/cars/index.html', controller: 'CarsCtrl', reloadOnSearch: false })
.when('/bikes', { templateUrl: 'app/bikes/index.html', controller: 'BikesCtrl', reloadOnSearch: false });
在我的根index.html的某个地方有一个:
<a href="#/cars">Cars</a>
<a href="#/bikes">Bikes</a>
<div ng-view></div>
现在,我希望在DOM中同时加载和生成两个视图,并根据路由/ URL显示其中一个.
类似下面的内容(不是实际的工作代码,只是为了给你一个想法).
app.js:
$routeProvider
.when('/cars', { controller: 'CarsCtrl', reloadOnSearch: false })
.when('/bikes', { controller: 'BikesCtrl', reloadOnSearch: false });
root index.html:
<a href="#/cars">Cars</a>
<a href="#/bikes">Bikes</a>
<div ng-include="'app/cars/index.html'" ng-show="carsVisible"></div>
<div ng-include="'app/bikes/index.html'" ng-show="bikesVisible"></div>
更新:我知道ng-view类型可以做到这一点,但差异,如果微妙,存在.我希望每个视图的html生成一次并始终保留在DOM中.
$routeProvider.when('/ticket', {
controller: TicketController,
templateUrl: Routing.generate('ticket_list')
});
显示一个简单的列表,其中每个条目都是可选的.但是在选择时不会加载额外的视图.每件事都在ticket_lost template.模板有一些隐藏字段,单击条目时会显示这些字段.
我可以通过设置定义内部选择的条目
selectedTicket = 1;
所以当有一条路线时
/ticket/1
我想调用一个将selectedTicket设置为1的函数.这可能吗？怎么做？我需要更改路由？
我在url中有一个动态值params,我想在onload时得到它并在控制器中使用但是我不知道如何处理 $route.current.params
假设我有这个路由提供商
$routeProvider.when('foo/:bar', {templateUrl: 'template.html'};
然后在我的控制器中
app.controller('mapCtrl', function($scope, $route, $routeParams) {
var param = $route.current.params.bar;
console.log(param);
});
如果用户访问foo/abcdefg假设应该在控制台中显示abcdefg但我收到错误.'无法读取属性'params'的undefined'
假设我有一个用于编辑电子贺卡的Angular应用程序.创建新的eCard使用路径#/ecard/create,编辑现有的eCard使用类似的路径#/ecard/:id.标签系统让我们可以打开多个电子贺卡进行编辑.
我们喜欢自动保存功能,例如用户期望的内容,例如现代网络邮件或wiki软件(或StackOverflow本身).我们不想在用户打开创建表单时保存电子贺卡草稿,这会给我们提供大量空白电子贺卡,因此我们会在用户开始输入后开始自动保存.
我想在我们的控制器中编写这样的代码(这被简化为不包括例如错误处理或在关闭选项卡时停止自动保存等):
$scope.autosave = function () {
ECardService.autosave($scope.eCard).then(function (response) {
$location.path('/ecard/' + response.id).replace();
$timeout($scope.autosave, AUTOSAVE_INTERVAL);
});
};
$timeout($scope.autosave, AUTOSAVE_INTERVAL);
上面的代码工作得很好,除了一件事:当位置改变时,我们的控制器重新加载并且视图重新渲染.因此,如果用户在自动保存完成时处于打字过程中,则会出现短暂的闪烁,并且会丢失它们的位置.
我已经考虑了几种方法来缓解这个问题:
1)更改路径以使用搜索路径并在配置中设置reloadOnSearch为.因此路径将从例如变为例如并且因此不强制重新加载.问题是我可能打开了多个电子贺卡,我确实希望从例如更改为触发路由更改并重新加载控制器.所以这不可行.falsengRoute#/ecard?id=create#/ecard/id=123#/ecard/id=123#/ecard/id=321
2)在这种情况下,不要打扰编辑URL并处理后退按钮给出奇怪的行为.这很诱人,但如果用户打开现有电子贺卡列表并尝试打开已保存的特定电子贺卡,我们希望标签系统能够识别它应该只显示当前存在的标签而不是打开新标签.
我们理论上可以通过更新我们的标签系统来更聪明地解决这个问题; 它不仅可以检查路径,还可以检查路径和持久性ID,我们可以存储在某处.这会使标签系统显得更加复杂,而这似乎对此功能有点过分.
3)仅在用户未主动编辑时更改URL,例如,编写一个$scope.userIsIdle()函数,true如果用户进行了任何编辑,则返回至少10秒,然后根据该函数更新路径.这个的简化版本看起来像:
$scope.updatePathWhenSafe = function (path) {
if ($scope.userIsIdle()) {
$location.path(path).replace();
} else {
$timeout(function () {
$scope.updatePathWhenSafe(path);
}, 1000);
}
};
我最终选择了#3; 它比选项#2简单得多,但实现和测试要比我想要的复杂得多,特别是一旦我考虑了边缘情况,例如"当超时触发时标签不再是活动标签怎么办？" 我希望选项#4成为可能.
4)在Angular之外编辑当前位置和历史,假设这是必要且可能的.这将是我的首选解决方案,但我的研究表明,尝试绕过$location服务更改路径或编辑历史记录是不安全/可取的.有没有一些安全的方法来做到这一点？如果我只能说"更改当前路径但不重新加载控制器" ,那么事情会变得如此简单.
选项#4可行/可行吗？如果没有,那么还有更好的方法吗？也许一些神奇的"做角度方式,但不知何故不刷新控制器"？
使用ngRoute可以在事件中挂钩:$routeChangeStart并执行不同的操作......
app.run(function ($rootScope, $location) {
$rootScope.$on("$routeChangeStart", function (event, next, current) {
................
使用UI-Router可以实现相同的功能吗？
怎么可能URL从路由参数中获取哈希片段$routeChangeStart.
$scope.$on('$routeChangeStart', function (event, next, current) {
// trying to get the url hash fragment from <next> param here
// e.g. to_url_function(next) -> '/my_path/1'
});
接收URL hash片段很容易使用,$locationChangeStart但这对我来说不是一个选择.