Tag: angular度ui路由器

Angular UI Router:根据父parsing对象决定子状态模板

这是我的app.js文件 – 我有一个父状态和两个子状态。 这两个子视图都需要这个对象。 states.push({ name: 'parentstate', url: '/parent/:objId', abstract: true, templateUrl: 'views/parentview.html', controller: function() {}, resolve: { obj: function(OBJ, $stateParams) { return OBJ.get($stateParams.objId); } } }); 我想用这个parsing的obj来决定子模板 states.push({ name: 'parentstate.childs', url: '/edit', views: { "view1@parentstate": { templateUrl: 'views/view1', controller: 'view1Ctrl' }, "view2@parentstate": { templateUrl: function(obj) { if (obj.something == something) { return "views/view2first.html"; } […]

Angular / UI路由器 – 如何更新url而不刷新所有内容?

我是Angular和ui路由器的新手。 当有人select一个模型,我的控制器执行一个标准的SHOW方法时,我只是想更新URL来包含模型的ID,而不刷新页面,并继续我的原始视图。 我不知道该怎么做 $stateProvider .state('citylist', { url: "/", templateUrl: "views/index.html" }) .state('cityshow', { url: "/city/:id", templateUrl: "views/index.html" }) angular.module('app.system').controller('IndexController', ['$scope', 'Global', 'Cities', '$stateParams', '$location', function ($scope, Cities, $stateParams, $location) { $scope.loadTown = function(id) { Cities.get({id: id }, function(city) { $scope.city = city // Change URL // Do things within the same view… }); }; }); […]

Angular UI路由器嵌套状态在子状态下parsing

在我正在处理的angular度应用程序中,我想要有一个抽象的父状态,它必须解决其所有子状态的某些依赖关系。 具体来说,我想要所有的状态需要一个经过身份validation的用户从一些authroot状态inheritance依赖。 我遇到的问题有父依赖不总是被重新解决。 理想情况下,我想让父状态检查用户是否仍然自动login到任何子状态。 在文档中 ,它说 子状态将从父状态inheritance已parsing的依赖关系,可以覆盖它们。 我发现如果从父类之外的状态input任何子状态,父类依赖关系只能被重新parsing,但是如果在父类之间移动,则不能。 在这个例子中,如果你在状态authroot.testA和authroot.testB之间移动,GetUser方法只被调用一次。 当你移动到other状态时,它会再次运行。 我能够将用户依赖关系放在每个子状态上,以确保每次进入这些状态时都会调用该方法,但是这似乎是失败了inheritance依赖关系的目的。 我不正确地理解文档吗? 有没有办法强制父母国家重新解决其依赖关系,即使当兄弟姐妹之间的状态改变? 的jsfiddle <!doctype html> <html> <head> <script src="../../../ajax/libs/angular.js/1.2.1/angular.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.0/angular-ui-router.min.js"></script> <script> (function(ng) { var app = ng.module("Test", ["ui.router"]); app.config(["$stateProvider", "$urlRouterProvider", function(sp, urp) { urp.otherwise("/testA"); sp.state("authroot", { abstract: true, url: "", template: "<div ui-view></div>", resolve: {User: ["UserService", function(UserService) { console.log("Resolving dependency…"); return UserService.GetUser(); }]} […]

使用UI-Router设置页面标题

我正在迁移我的基于AngularJS的应用程序使用ui路由器,而不是内置路由。 我已经configuration如下所示 .config(function($stateProvider, $urlRouterProvider) { $urlRouterProvider.otherwise('/home'); $stateProvider .state('home', { url: '/home', templateUrl : 'views/home.html', data : { pageTitle: 'Home' } }) .state('about', { url: '/about', templateUrl : 'views/about.html', data : { pageTitle: 'About' } }) }); 我如何使用pageTitlevariables来dynamic设置页面的标题? 使用内置路由,我可以做到 $rootScope.$on("$routeChangeSuccess", function(currentRoute, previousRoute){ $rootScope.pageTitle = $route.current.data.pageTitle; }); 然后在HTML中绑定variables,如下所示 <title ng-bind="$root.pageTitle"></title> 有没有类似的事件,我可以使用ui路由器挂钩? 我注意到有'onEnter'和'onExit'函数,但它们似乎与每个状态绑定,并要求我重复代码来设置每个状态的$ rootScopevariables。

试图根据常量在控制器中dynamic设置templateUrl

我想根据我在angularjs bootstrap中定义的预设常量来更改与控制器相关的templateUrl。 我无法弄清楚如何改变这一点。 我已经尝试过使用UrlRouteProvider,但一直没能弄清楚如何从文件系统中拉出html。 我卡在templateUrl上。 在下面的代码中,输出首先显示“svcc确实被传入了第一个函数的console.out,但是在templateUrl定义函数中,CONFIG是未定义的。 我打开其他方式来做到这一点。 var app = angular.module('svccApp', [ 'ui.router' ]); var myConstant = {}; myConstant.codeCampType = "svcc"; app.constant("CONFIG", myConstant); app.config(['$stateProvider', '$urlRouterProvider','CONFIG', function ($stateProvider, $urlRouterProvider,CONFIG) { console.log(CONFIG.codeCampType); $stateProvider .state('home', { url: '/home', //templateUrl: 'index5templateA.html', (THIS WORKS) templateUrl: function(CONFIG) { console.log('in templateUrl ' + CONFIG.codeCampType); if (CONFIG.codeCampType === "svcc") { return 'index5templateA.html'; } […]

如何使用$ state.go发送和检索参数toParams和$ stateParams?

我使用ui-router v0.2.0使用AngularJS v1.2.0-rc.2。 我想将引用状态传递给另一个状态,所以我使用$state.go像这样: $state.go('toState', {referer: $state.current.name}); 根据文档 ,这应该填充toState控制器上的$stateParams ,但它是undefined 。 我错过了什么? 我创造了一个庞然大物来演示: http://plnkr.co/edit/ywEcG1

使用ui-router显示404错误页面时如何更改url

我想显示404错误页面,但也想保存位置错误的url。 如果我会做这样的事情: $urlRouterProvider.otherwise('404'); $stateProvider .state('404', { url: '/404', template: error404Template }); url将更改为/404 。 如何在错误的URL上显示错误信息而不改变实际的URL?

AngularJS:使用ui-router将对象传递到一个状态

我希望能够转换到一个状态,并使用ui路由器传递一个任意的对象。 我知道,通常使用$ stateParams,但我相信这个值插入到URL中,我不希望用户能够collections这些数据。 我想要做这样的事情。 $state.transitionTo('newState', {myObj: {foo: 'bar'}}); function myCtrl($stateParams) { console.log($stateParams.myObj); // -> {foo: 'bar'} }; 有没有办法做到这一点,而不编码到URL的值?

将$ scope注入angular度服务函数()

我有一个服务: angular.module('cfd') .service('StudentService', [ '$http', function ($http) { // get some data via the $http var path = 'data/people/students.json'; var students = $http.get(path).then(function (resp) { return resp.data; }); //save method create a new student if not already exists //else update the existing object this.save = function (student) { if (student.id == null) { //if this […]

重新加载当前状态 – 刷新数据

我正在使用Angular UI路由器,并希望重新加载当前状态并刷新所有数据/重新运行当前状态和它的父母的控制器。 我有3个州级别: directory.organisations.details directory.organisations包含一个包含组织列表的表。 点击表中的一个项目加载directory.organisations.details与$ StateParams传递项目的ID。 所以在细节状态下,我加载这个项目的细节,编辑它们,然后保存数据。 迄今为止都很好。 现在我需要重新加载这个状态并刷新所有的数据。 我努力了: $state.transitionTo('directory.organisations'); 哪些去父母状态,但不重新加载控制器,我猜是因为path没有改变。 理想情况下,我只想保持在directory.organisations.details状态并刷新父项中的所有数据。 我也试过了: $state.reload() 我已经在API WIKI上看到了$ state.reload的这个问题(控制器现在重新实现的bug,很快就会修复)“。 任何帮助将不胜感激?