我有一个父州,里面有两个孩子的州,我将根据这个州显示一个州URL.
在这两个中有states一个像param1和的参数param2,我params在状态定义中使用了ui-router选项.
州
$stateProvider.state('tabs.account', {
url: '/account',
views: {
'content@tabs': {
templateUrl: 'account.html',
controller: function($scope, $stateParams) {
//This params are internally used to make ajax and show some data.
$scope.param1 = $stateParams.param1;
$scope.param2 = $stateParams.param2;
},
}
},
params: {
param1: { value: null }, //this are optional param
param2: { value: null } //because they are not used in url
}
});
如果你看看我的路线,params选项并没有真正引入其中URL,这就是为什么我当时认为是可选的.
看看plunkr,我已经显示了两个标签Account& …
javascript angularjs angular-ui angularjs-routing angular-ui-router
我想找出AngularJS中的.config和.run函数之间的区别.我正在使用我.config来设置路线,但我确实有一些$on用于观察路线更改开始和成功事件.
然后我移动了一些代码,.run因为我有一些依赖注入问题.config.
我终于将其中一部分移到了CommonAppController我设置的部分上<body>.
我也有2个.config,似乎运行正常,但肯定这不对吗？
任何人都可以对使用哪种方法有所了解？
我很困惑控制器何时实例化.此外,嵌套状态时控制器如何实例化.我可能会对范围如何附加到视图和控制器感到困惑,也就是说,如果每个视图都有自己的控制器和范围,或者它们共享相同的范围.
有人可以解释控制器何时实例化？在嵌套路由下,所有视图共享一个控制器和范围吗？当我切换状态并返回状态会发生另一个控制器实例化时会发生什么？
以下是我的路线(配置文件):
.config (googleAnalyticsCordovaProvider, $stateProvider, $urlRouterProvider, IdleProvider, KeepaliveProvider) ->
$stateProvider
.state('app', {
url: '/app',
abstract: true,
templateUrl: 'templates/menu.html',
controller: 'AppController'
})
.state('app.pincode', {
url: '/pincode',
views: {
menuContent: {
templateUrl: 'templates/pincode-yield.html',
controller: 'PincodeController'
}
}
})
.state('app.pincode.create', {
url: '/create',
views: {
pincode: {
templateUrl: 'templates/pincode-create.html',
controller: 'PincodeController'
}
}
})
.state('app.pincode.pincodeLogin', {
url: '/login',
views: {
pincode: {
templateUrl: 'templates/pincode-login.html',
controller: 'PincodeController'
}
}
})
.state('app.pincode.settings', {
url: '/settings',
views: {
pincode: {
templateUrl: 'templates/settings.html',
controller: 'PincodeController'
} …angularjs angularjs-scope angularjs-routing angular-ui-router
例如:
$stateProvider
.state('external', {
url: 'http://www.google.com',
})
url假设这是一个内部状态.我希望它像href或者那种效果.
我有一个将从ui路由构建的导航结构,我需要一个链接转到外部链接.不一定只是谷歌,这只是一个例子.
不是在链接中查找,也不是在$ state.href(' http://www.google.com ')中查找.在路由配置中以声明方式需要它.
routing angularjs single-page-application angularjs-routing angular-ui-router
我有以下代码;
var app =
angular.
module("myApp",[]).
config(function($routeProvider, $locationProvider) {
$routeProvider.when('/someplace', {
templateUrl: 'sometemplate.html',
controller: SomeControl
});
// configure html5 to get links working on jsfiddle
$locationProvider.html5Mode(true);
});
app.controller('SomeControl', ...);
我收到以下错误
Uncaught ReferenceError: SomeControl is not defined from myApp
问题只是我不能使用app.controller('SomeControl',...)语法？什么时候使用$ routeProvider？是唯一有效的语法:
function SomeControl(...)
我的问题实际上与这里发现的问题非常相似:
简而言之,我正在使用$ routeChangeStart并尝试使用$ location更改当前路由.当我这样做时,控制台告诉我原始页面仍然加载并被新页面快速覆盖.
提供的解决方案是使用$ locationChangeStart而不是$ routeChangeStart,这应该可以防止额外的重定向.不幸的是,我在$ routeprovider中使用了我需要在更改路径时访问的其他数据(我用它来跟踪页面限制).这是一个例子......
$routeProvider.
when('/login', { controller: 'LoginCtrl', templateUrl: '/app/partial/login.html', access: false}).
when('/home', { controller: 'HomeCtrl', templateUrl: '/app/partial/home.html', access: true}).
otherwise({ redirectTo: '/login' });
$rootScope.$on('$routeChangeStart', function(event, next, current) {
if(next.access){
//Do Stuff
}
else{
$location.path("/login");
//This will load the current route first (ie: '/home'), and then
//redirect the user to the correct 'login' route.
}
});
使用$ routeChangeStart,我可以使用"next"和"current"参数(请参阅AngularJS - $ route)作为对象来检索我的"访问"值.使用$ locationChangeStart,这两个参数返回url字符串,而不是对象.所以似乎无法检索我的"访问"值.
有没有什么方法可以将$ locationChangeStart的重定向停止功能与$ routeChangeStart的对象灵活性结合起来,以实现我的需求？
javascript routes angularjs angularjs-directive angularjs-routing
我目前有一个内置路由的AngularJS应用程序,它与静态controller属性赋值完美配合.但我真正想做的是动态分配不同路径的控制器:
$routeProvider
.when("/Dashboards/:dashboardName",{
templateUrl:function(params) {
return "Dashboards/" + params.dashboardName;
//some ASP.NET MVC calls to return partial views (this part works)
}
})
我想做的是在controller这里对我的财产做同样的事情,比如:
$routeProvider
.when("/Dashboards/:dashboardName",{
templateUrl:function(params) {
return "Dashboards/" + params.dashboardName;
//some ASP.NET MVC calls to return partial views (this part works)
},
controller: function(params) {
return params.dashboardName+"Controller"; (this part DOESN'T work)
}
})
但似乎我得到一个错误说paramsProvider找不到
那么有什么方法可以在路由配置中动态加载我的控制器功能名称？
所以这就是我想要完成的事情:
'use strict';
var app = angular.module('myModule', ['ngRoute']);
app.config(function($routeProvider) {
$routeProvider
.when('/', {
redirectTo: '/pages'
})
.when('/pages/:pageName', {
templateUrl: 'views/pages/'+pageName+'html',
controller: 'MainController'
});
});
基本上,我想使用uri来确定使用哪个模板.目前我收到一个错误,我没有定义pageName,我理解.这样做会有什么不同的方式？谢谢!
我正在尝试解析来自Foursquare的access_token,其中URL如下所示:
https://mywebsite.com/4sqredirect/#access_token=1234567890XXXXX
我尝试了$ routeParams和$ location并且没有得到任何回报.只有在我尝试$ route之后,我确实得到了一个具有以下属性的对象:
current: {
params: { }
pathParams: { }
loadedTemplateUrl: partials/4sqredirect
locals: { }
scope: {
this: {
$ref: $["current"]["scope"]
}
route: {
$ref: $
}
location: { }
token: null
}
}
这是否意味着无法使用原生的AngularJS函数来获取它？
更新:
我的控制器如下所示:
angular.module('myApp')
.controller('4sqredirectCtrl', function ($scope, $route, $location, $routeParams) {
$scope.route = $route;
$scope.location = $location;
$scope.token = $routeParams.access_token;
});
我的主要js如下所示:
angular.module('myApp', [
'ngCookies',
'ngResource',
'ngSanitize',
'ngRoute'
])
.config(function ($routeProvider, $locationProvider) {
$locationProvider.html5Mode(true);
$routeProvider
.when('/', {
templateUrl: 'partials/main',
controller: 'MainCtrl'
}) …我试图在我的应用程序加载之前执行异步http请求以加载一些数据,因此我在$ routeProvider中使用了一个解析,这是我的MainController中的http请求.出于某种原因,我不断收到错误:[$ injector:unpr]未知提供者:appDataProvider < - appData其中appData是我做http请求的地方.我正在使用AngularJS v 1.2.5.
这是我尝试的代码和两个方法,它们都给出了同样的错误:
方法#1
MainController.js
var MainController = ['$scope','$location','appData',
function($scope, $location, appData){
console.log(appData.data);
}
];
MainController.loadData = {
appData: function($http, $location, MainFactory){
var aid = MainFactory.extractAid($location);
return $http({method: 'GET', url: URL_CONST + aid});
}
};
app.js
var app = angular.module('HAY', ['ngRoute']);
app.config(function($routeProvider) {
$routeProvider
.when('/', {
redirectTo: '/pages/alerts'
})
.when('/pages/:pageName', {
templateUrl: function(params) {
return 'views/pages/' + params.pageName + '.html';
},
controller: MainController,
resolve: MainController.loadData
})
.otherwise({
redirectTo: '/pages/alerts'
});
});
我尝试更改名称,以防它是一个冲突的系统保留关键字,但没有运气.出于某种原因, …
angularjs ×10
javascript ×4
controller ×2
angular-ui ×1
foursquare ×1
routes ×1
routing ×1
url ×1