angularjs

Delaying AngularJS route change until model loaded to prevent flicker

by

$routeProvider resolve property allows delaying of route change until data is loaded. First define a route with resolve attribute like this. angular.module(‘phonecat’, [‘phonecatFilters’, ‘phonecatServices’, ‘phonecatDirectives’]). config([‘$routeProvider’, function($routeProvider) { $routeProvider. when(‘/phones’, { templateUrl: ‘partials/phone-list.html’, controller: PhoneListCtrl, resolve: PhoneListCtrl.resolve}). when(‘/phones/:phoneId’, { templateUrl: ‘partials/phone-detail.html’, controller: PhoneDetailCtrl, resolve: PhoneDetailCtrl.resolve}). otherwise({redirectTo: ‘/phones’}); }]); notice that the resolve property is defined … Read more

How to handle anchor hash linking in AngularJS

by

You’re looking for $anchorScroll(). Here’s the (crappy) documentation. And here’s the source. Basically you just inject it and call it in your controller, and it will scroll you to any element with the id found in $location.hash() app.controller(‘TestCtrl’, function($scope, $location, $anchorScroll) { $scope.scrollTo = function(id) { $location.hash(id); $anchorScroll(); } }); <a ng-click=”scrollTo(‘foo’)”>Foo</a> <div id=”foo”>Here you … Read more

How to deep watch an array in angularjs?

by

You can set the 3rd argument of $watch to true: $scope.$watch(‘data’, function (newVal, oldVal) { /*…*/ }, true); See https://docs.angularjs.org/api/ng/type/$rootScope.Scope#$watch Since Angular 1.1.x you can also use $watchCollection to watch shallow watch (just the “first level” of) the collection. $scope.$watchCollection(‘data’, function (newVal, oldVal) { /*…*/ }); See https://docs.angularjs.org/api/ng/type/$rootScope.Scope#$watchCollection

$watch an object

by

Call $watch with true as the third argument: $scope.$watch(‘form’, function(newVal, oldVal){ console.log(‘changed’); }, true); By default when comparing two complex objects in JavaScript, they will be checked for “reference” equality, which asks if the two objects refer to the same thing, rather than “value” equality, which checks if the values of all the properties of … Read more

AngularJS: How can I pass variables between controllers?

by

One way to share variables across multiple controllers is to create a service and inject it in any controller where you want to use it. Simple service example: angular.module(‘myApp’, []) .service(‘sharedProperties’, function () { var property = ‘First’; return { getProperty: function () { return property; }, setProperty: function(value) { property = value; } }; … Read more

passing 2 $index values within nested ng-repeat

by

Each ng-repeat creates a child scope with the passed data, and also adds an additional $index variable in that scope. So what you need to do is reach up to the parent scope, and use that $index. See http://plnkr.co/edit/FvVhirpoOF8TYnIVygE6?p=preview <li class=”tutorial_title {{tutorial.active}}” ng-click=”loadFromMenu($parent.$index)” ng-repeat=”tutorial in section.tutorials”> {{tutorial.name}} </li>

How to access parent scope from within a custom directive *with own scope* in AngularJS?

by

See What are the nuances of scope prototypal / prototypical inheritance in AngularJS? To summarize: the way a directive accesses its parent ($parent) scope depends on the type of scope the directive creates: default (scope: false) – the directive does not create a new scope, so there is no inheritance here. The directive’s scope is … Read more

How to reload the current state?

by

I found this to be the shortest working way to refresh with ui-router: $state.go($state.current, {}, {reload: true}); //second parameter is for $stateParams Update for newer versions: $state.reload(); Which is an alias for: $state.transitionTo($state.current, $stateParams, { reload: true, inherit: false, notify: true }); Documentation: https://angular-ui.github.io/ui-router/site/#/api/ui.router.state.$state#methods_reload

Hata!: SQLSTATE[HY000] [1045] Access denied for user 'divattrend_liink'@'localhost' (using password: YES)