我正在尝试构建一个视图 - 我已经设置了两个控制器来练习,一个是HeaderCtrl,里面有一些数据(网站标题,标题背景等),另一个应该有页面的主要内容 - MainCtrl.
在定义路线时,我这样做:
mainApp.config(function ($routeProvider) {
$routeProvider
.when('/',
{
controller: 'MainCtrl',
templateUrl: 'modules/dashboard.html'
})
})
这非常好用,但我想要的是为此指定多个参数,如下所示:
mainApp.config(function ($routeProvider) {
$routeProvider
.when('/',
{
controller: 'HeaderCtrl',
templateUrl: 'modules/header.html'
},
{
controller: 'MainCtrl',
templateUrl: 'modules/dashboard.html'
})
})
这不起作用所以我猜它不是这样做的方法.我实际上在问什么 - 你能在$ routeProvider中指定多个控制器吗？或者构建此视图的正确方法是什么？
我想使用路由,但我总是想使用相同的模板和控制器.我有这样的路线:
**a/:albumid**
和
**i/:imageid**
在第一种情况下,我想加载一个图像数组并将它们添加到列表中.在第二种情况下,我想加载一个图像并将其添加到列表中.
所以区别仅在于数据加载.最有效的方法是什么？
还可以为ng-show制作动画吗？有点像jQuery的slideDown吗？
为什么父视图必须是抽象的才能呈现子视图(嵌套视图)？
$stateProvider
.state('A', {url: '/A', abstract: true, templateUrl: 'views/A.html'})
.state('A.B', {url: '', abstract: true, templateUrl: 'views/B.html'})
.state('A.B.C', {url:'', abstract:false, templateUrl:'views/C.html'});
父视图"A"在home.html中托管如下:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Yomingo</title>
<link href="lib/bootstrap/css/bootstrap.css" rel="stylesheet"/>
<link href="lib/bootstrap/css/bootstrap-responsive.css" rel="stylesheet"/>
</head>
<body>
<div ui-view>
</div>
<script type="text/javascript" data-main="scripts/main" src="lib/require/require.js"></script>
</body>
</html>
如果任何父状态'A'或'B'被标记为abstract = false,则不呈现ui-view内容.
我正在尝试运行此代码:
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<title>Exemple 06</title>
</head>
<body>
<!-- Diretiva ng-repeat -->
<div ng-controller="MyController">
<a ng-href="#/">Page 1</a> | <a ng-href="#/p2">Page 2</a>
<div ng-view="#/p2"></div>
</div>
<script src="js/angular.js"></script>
<script src="js/angular-route.js"></script>
<script type="text/javascript">
var myApp = angular.module('myApp', ['ngRoute']);
myApp.config(function($routeProvider){
$routeProvider
.when('/' , {controller: 'MyController', templateUrl: 'p1.html'})
.when('/p2', {controller: 'MyController', templateUrl: 'p2.html'})
.otherwise({ redirectTo: '/'});
});
myApp.controller('MyController', function($scope){
$scope.nomes = [
{id: 1, nome: 'Arthur'},
{id: 2, nome: 'Portos'},
{id: 3, nome: 'Aramis'}
];
});
</script>
</body>
但是会出现以下错误:
XMLHttpRequest无法加载file:///home/93579551515/Desktop/Angular/p1.html.仅支持HTTP的跨源请求.
我不想在网络服务器上运行它.
我在使用AngularJS v1.2.0和PhoneGap/Cordova Android应用程序进行路径查找时遇到问题.html5mode(true)通过<base href="."/>在index.html中设置然后更改$routeProvider.when('/')为,我已经相当远了$routeProvider.when('/android_asset/www/index.html').在那之后,我能够redirectTo('login')达到$routeProvider.when('/login')并按templateUrl: 'static/partials/login.html'预期进行渲染.
我$location.path('/login');遇到的问题是,如果我尝试从我的Javascript代码重定向到登录页面,则会找到路由但是templateUrl加载失败并出现insecurl异常.
我已经尝试使用新的angular-sanitize模块将文件列入白名单来访问://但这没有用.
我怎样才能$location.path()做同样的事情,redirectTo以便加载部分？或者还有其他方法可以解决这个问题吗？
更新:我通过在路径函数之后添加对replace()的调用来向前推进,例如:
$location.path('/login').replace();
但这似乎是一个黑客,它仍然导致其他路由中的templateUrl失败并出现相同的异常.
关于可能出错的任何想法？是不是html5mode(true)只是在这个时候用Phonegap不起作用,解决这个问题的唯一方法是将它设置为false并将hashtags添加到每个路径(就像在angular phonegap 种子项目中完成的那样)？
我正在尝试在我的角应用程序上实现授权,当路由被更改时我想检查路由是否被授权给用户.我尝试过,$routeChangeStart但它并没有阻止这个事件.
我目前的代码:
$scope.$on('$routeChangeStart', function(event, next, current) {
if(current_user.is_logged_in){
var route_object = next.route_object;
if(!(route_object.route_roles)){
event.preventDefault();
}
}
});
在我的next对象中,我得到了在我的设置中的route_object$routeProvider
var routes = object;
app.config(function($routeProvider) {
$routeProvider.when(url, {
templateUrl: "/users.html",
route_object: routes,
});
});
routes是一个在我的函数中形成的对象,但是当我使用时,$locationChangeStart我只是获取下一页和上一页的url,
我如何获得整个路径对象？
我正在做的事情:
我正在尝试在Google App Engine上构建RESTful Flask应用程序,使用Angular处理路由和视图逻辑,而Flask处理后端逻辑和资源.
问题:
当我为GAE启动开发服务器时,第一页完全加载.问题是,当我单击页面顶部的"引荐"链接时,正在加载的模板不会更改.
到目前为止我做了什么
虽然看起来我下面粘贴了很多代码,但大部分代码都是标记,并且实际上并没有任何复杂的应用程序逻辑,所以略读是足够的
我计划先建立前端,然后是后端(虽然我已经有了一些后端设置).该应用程序目前不依赖于烧瓶应用程序(它没有任何应用程序逻辑,也没有任何请求处理程序)
这是我的app.js文件,到目前为止我所做的只是路由,没有逻辑:
// app.js, only angular code in project and only does routing
var rcsApp = angular.module('rcsApp', [
'ngRoute'
]);
rcsApp.config(['$routeProvider',
function($routeProvider) {
$routeProvider.
when('/', {
templateUrl: 'templates/welcome-page.html'
}).
when('/index', {
templateUrl: 'templates/welcome-page.html'
}).
when('/referrals', {
templateUrl: 'templates/referrals.html'
}).
when('/404', {
templateUrl: 'templates/404.html'
}).
otherwise({
redirectTo: '/404'
});
}]);
这是我的app.yaml文件,这是我用来提供静态页面的内容
# This file specifies your Python application's runtime configuration
# including URL routing, versions, static file uploads, etc. See
# https://developers.google.com/appengine/docs/python/config/appconfig …我只是想知道是否有办法知道是否有人正在更改URL的路由.
举个例子,我在html中有这样的东西:
<a ng-href="#/somewhere">To somewhere</a>
我正在使用这个:
$scope.$on('$routeChangeSuccess', function (scope, next, current) {
//Some code
})
但是,我刚刚意识到我需要在更改URL之前运行此代码.有没有办法达到这个目的,并且也有相同的方法,next并current知道我将在哪里重定向,从哪里来？
以前,我ngRoute在我的主控制器中使用.我必须创建子视图功能,它只能实现UI-Router.请指教？