To get even more detailed answers, we can/should observe the source code and check the documentation. Let me try to explain all three questions (and also cite from code and doc). 1. When do controllers get instantiated? Here we can observe the code of the ui-view directive: [$ViewDirective.$inject = \[‘$state’, ‘$injector’, ‘$uiViewScroll’, ‘$interpolate’\];][1] Controllers are … Read more
Re-reading this article http://ify.io/lazy-loading-in-angularjs/ suggested to keep a $contentProvider instance inside Angular App. I came up with this code in my app.js demoApp.config(function ($controllerProvider) { demoApp.controller = $controllerProvider.register; }); It enables me to write my controller as expected in a external javascript file : angular.module(“demoApp”).controller(‘MouseTestCtrlA’, fn); Hope this can help !
It is correct that routes do not work with query strings, however that doesn’t mean you can’t use query strings to pass data between pages when switching routes! The glaring limitation with route parameters is that they can’t be updated without reloading the page. Sometimes this isn’t desired, for instance after saving a new record. … Read more
This alternative also provides a back function. The template: <a ng-click=’back()’>Back</a> The module: myModule.run(function ($rootScope, $location) { var history = []; $rootScope.$on(‘$routeChangeSuccess’, function() { history.push($location.$$path); }); $rootScope.back = function () { var prevUrl = history.length > 1 ? history.splice(-2)[0] : “https://stackoverflow.com/”; $location.path(prevUrl); }; });
Routes monitor the $location service and respond to changes in URL (typically through the hash). To “activate” a route, you simply change the URL. The easiest way to do that is with anchor tags. <a href=”#/home”>Go Home</a> <a href=”#/about”>Go to About</a> Nothing more complicated is needed. If, however, you must do this from code, the … Read more
It looks like Angular has support for this now. From the latest (v1.2.0) docs for $routeProvider.when(path, route): path can contain optional named groups with a question mark (:name?)
Angular-ui-router doesn’t support external URL, you need redirect the user using either $location.url() or $window.open() I would suggest you to use $window.open(‘http://www.google.com’, ‘_self’) which will open URL on the same page. Update You can also customize ui-router by adding parameter external, it can be true/false. $stateProvider .state(‘external’, { url: ‘http://www.google.com’, external: true }) Then configure … Read more
I use resolve to save the current state data before moving to the new state: angular.module(‘MyModule’) .config([‘$stateProvider’, function ($stateProvider) { $stateProvider .state(‘mystate’, { templateUrl: ‘mytemplate.html’, controller: [“PreviousState”, function (PreviousState) { if (PreviousState.Name == “mystate”) { // … } }], resolve: { PreviousState: [“$state”, function ($state) { var currentStateData = { Name: $state.current.name, Params: angular.copy($state.params), URL: … Read more
The problem is that your ngView retains the scroll position when it loads a new view. You can instruct $anchorScroll to “scroll the viewport after the view is updated” (the docs are a bit vague, but scrolling here means scrolling to the top of the new view). The solution is to add autoscroll=”true” to your … Read more
Both do the same work as they are used for routing purposes in SPA(Single Page Application). 1. Angular Routing – per $routeProvider docs URLs to controllers and views (HTML partials). It watches $location.url() and tries to map the path to an existing route definition. HTML <div ng-view></div> Above tag will render the template from the … Read more