Skip to content
This repository has been archived by the owner on Apr 12, 2024. It is now read-only.

Commit

Permalink
feat(ngView): reference resolved locals in scope
Browse files Browse the repository at this point in the history
All the resolves for a route are now attached to the route's local scope,
as the property whose name is given by the `resolveAs` property on the
route definition.

If `resolveAs` is not specified it defaults to `$resolve`.

This will make it easier to use `ngRoute`, by being able to reference all
the resolve values for the route, directly on the scope, rather than having
to implement a controller just to copy the resolves across manually.

For example, rather than

```js
$routeProvider.when('/', {
  resolve: {
    item1: ($http) => $http.get(...),
    item2: ($http) => $http.get(...)
  },
  template: '<my-app item1="vm.item1" item2="vm.item2">'</my-app>`,
  controllerAs: 'vm',
  controller: ['item1', 'item2', function(item1, item2) {
    this.item1 = item1;
    this.item2 = item2;
  }]
});
```

one can now do

```js
$routeProvider.when('/', {
  resolve: {
    item1: ($http) => $http.get(...),
    item2: ($http) => $http.get(...)
  },
  template: '<my-app item1="$resolve.item1" item2="$resolve.item2">'</my-app>`
});
```

BREAKING CHANGE:

A new property is being attached to the scope of the route. The default name
for this property is `$resolve`. If your scope already contains a property
with this name then it will be hidden or overwritten.

In this case, you should choose a custom name for this property, that will
not collide with other properties on the scope, by specifying the `resolveAs`
property on the route.

Closes #13400
  • Loading branch information
Shahar Talmi authored and petebacondarwin committed Dec 4, 2015
1 parent 25e8c59 commit 983b059
Show file tree
Hide file tree
Showing 2 changed files with 42 additions and 0 deletions.
1 change: 1 addition & 0 deletions src/ngRoute/directive/ngView.js
Original file line number Diff line number Diff line change
Expand Up @@ -275,6 +275,7 @@ function ngViewFillContentFactory($compile, $controller, $route) {
$element.data('$ngControllerController', controller);
$element.children().data('$ngControllerController', controller);
}
scope[current.resolveAs || '$resolve'] = locals;

link(scope);
}
Expand Down
41 changes: 41 additions & 0 deletions test/ngRoute/directive/ngViewSpec.js
Original file line number Diff line number Diff line change
Expand Up @@ -120,6 +120,47 @@ describe('ngView', function() {
});


it('should reference resolved locals in scope', function() {
module(function($routeProvider) {
$routeProvider.when('/foo', {
resolve: {
name: function() {
return 'shahar';
}
},
template: '<div>{{$resolve.name}}</div>'
});
});

inject(function($location, $rootScope) {
$location.path('/foo');
$rootScope.$digest();
expect(element.text()).toEqual('shahar');
});
});


it('should allow to provide an alias for resolved locals using resolveAs', function() {
module(function($routeProvider) {
$routeProvider.when('/foo', {
resolveAs: 'myResolve',
resolve: {
name: function() {
return 'shahar';
}
},
template: '<div>{{myResolve.name}}</div>'
});
});

inject(function($location, $rootScope) {
$location.path('/foo');
$rootScope.$digest();
expect(element.text()).toEqual('shahar');
});
});


it('should load content via xhr when route changes', function() {
module(function($routeProvider) {
$routeProvider.when('/foo', {templateUrl: 'myUrl1'});
Expand Down

0 comments on commit 983b059

Please sign in to comment.