angular-ui-router | 易学教程

Nested child state with ui-router

阅读更多关于 Nested child state with ui-router

问题 As I'm working on an Angular app, I was wondering about ui-route nested states. As said in the docu, it's possible to create nested state such as (taken from the doc) : $stateProvider .state('contacts', { templateUrl: 'contacts.html', controller: function($scope){ $scope.contacts = [{ name: 'Alice' }, { name: 'Bob' }]; } }) .state('contacts.list', { templateUrl: 'contacts.list.html' }); But is it possible to create a granchild state ? (possibly by adding something like) : .state('contacts

Child route does not trigger

阅读更多关于 Child route does not trigger

问题 I am building this route system var app = angular.module('plunker', ['ui.router']); app.config(function ($stateProvider, $urlRouterProvider) { $urlRouterProvider .when('/admin', '/admin/dashboard') .when('/user', '/user/dashboard') .otherwise('/admin/dashboard'); $stateProvider .state('admin', { url: '/admin/dashboard', resolve: { test: function() { console.log('called admin'); return; } }, views: { 'navigation': { template: '<div>admin navigation. Go <a ui-sref="admin.link1">link1</a></div>'

How to delay running logic for directive until ui-route is resolved?

阅读更多关于 How to delay running logic for directive until ui-route is resolved?

问题 I am using AngularJS with ui-router. I am attempting to make use of the AngularJS PDF directive available at https://github.com/sayanee/angularjs-pdf. I'm having to make some changes to the example given because I do not have the URL to the PDF right off the bat. However, I ran into a problem. Because I pass an id value associated with the PDF into the route, I have to wait to resolve that parameter until the route change has been successful. I accomplished this with the guidance at https:/

Try to render two templates in same View (Ui-Router)

阅读更多关于 Try to render two templates in same View (Ui-Router)

问题 I'm trying to render two templates at the same time in same View using two differents ui-view. I'm probably missing something but I don't know what. Can I get some help ? My App.js var routerApp = angular.module('routerApp', ['ui.router']); routerApp.config(function($stateProvider) { //$urlRouterProvider.otherwise('/home'); var People = { name: 'People', url: '/People', views: { 'PeopleView': { templateUrl: 'People.html' } } } var Company = { name: 'Company', url: '/Company', views: {

How to route using ngRoute (with Demo)

阅读更多关于 How to route using ngRoute (with Demo)

问题 My code starts from here <!DOCTYPE html> <html> <head> <title>Routing</title> </head> <body ng-app="myApp"> <a href="#/login">Login</a> <a href="#/register">Register</a> <div ng-view></div> </body> <script src="angular-min.js" type="text/javascript"></script> <script src="angular-route.js" type="text/javascript"></script> <script> var app = angular.module("myApp", ["ngRoute"]); app.config(function($routeProvider) { $routeProvider .when("/login", { templateUrl : "login.html" }) .when("

How do I reload an Angular partial for testing purpose?

阅读更多关于 How do I reload an Angular partial for testing purpose?

问题 I use the UI Router module in Angular (1). Typically it would look like myApp.config(function($stateProvider) { var helloState = { name: 'hello', url: '/hello', templateUrl: 'http://www.example.com/partials/helloWorld' } } Is it possible to reload this partial template forcefully during development where the source code keeps changing? Data changes can be mapped using two-way binding but that is not my scenario? I saw some answers related to the latter case. Is there something like $state

Lazyload to multiple views in ui-router

阅读更多关于 Lazyload to multiple views in ui-router

问题 A few months ago I've be created the topic: Try to render two templates in same View (Ui-Router), where I asked about how to render multiple views in the same page. My objective with this was created a web app as an desktop one, with views to minimize, maximize, close and stuff like that. Well, my app is ready but I'm getting a problem, when I up my app to the production some computers are taking a long time to render all the Views. In the image bellow we can se a lot of requisitions that

Use config.json file's parameters in app

阅读更多关于 Use config.json file's parameters in app

问题 We are using google map api and we have a key. We have codede this key in one of our module file. We want to use this key in config.json file so that it should be secure and when we push our changes to git, it should not be available as we dont push our config.json file on git. I don't have any idea about this. mobile-content.module.ts @NgModule({ imports: [ AgmCoreModule.forRoot({ apiKey: 'GOOGLE-API KEY', libraries: ['places'] }), hip-config.json googleMapsApiKey: "GOOGLE-API KEY" <--- want

change an angularjs nested template at run time

阅读更多关于 change an angularjs nested template at run time

问题 I have a template which is nested inside another template which I want to load when i click on a button. So the nested template is loaded dynamically. This is what I have done so far. This is the main body.html (this loads when a url is provided in the browser e.g. http://url#/newtemplate) <div ui-view> </div> Other section of the code has been removed for brevity This is the new_template.html which I expects it to show when I click a button. When I put a template name directly like below i.e

bootstrap tabs does not work with angular ui router

阅读更多关于 bootstrap tabs does not work with angular ui router

问题 Thats the plunker as repro: http://plnkr.co/edit/aAsEiedQSrmIhL6KtGVL?p=preview The projects tab content is initially not visible. Only when I explicitly click on the projects tab its content gets visible. With the ui-sref="{{t.route}}" the edit/create state activation/rendering works. Using the original select="go(t.route)" the initial selection of the project tab works but the activation of the edit/create state fails. Weird things happen when you debug the code. How can I fix that buggy