Reputation: 120529
I'm trying to go directly from a URL controlled by a route to an attribute value. What's the most simple way to do this?
I have a route that looks like this:
..addRoute(
name: 'activities',
path: '/activities',
enter: view('views/activities.html'),
mount: (Route route) => route
..addRoute(
name: 'view',
path: '/:activityId',
enter: view('views/activity.html')));
I expect the following to work:
/activities
/activities/f4f3j4093j4f
The contents of views/activity.html
:
<activity-photo activity-id="{{how to get this? I have it in the route}}"></activity-photo>
As you can see, my view is just a custom element with one custom attribute. Can I fill that custom attribute directly from the route param?
Upvotes: 3
Views: 1100
Reputation: 2701
For any component/directive/controller inside the view you can ask to inject RouteProvider
which has parameters
field (Map).
@NgComponent(
selector: 'activity-photo',
...)
class ActivityPhotoComponent {
ActivityPhotoComponent(RouteProvider routeProvider) {
String activityId = routeProvider.parameters['activityId'];
_loadActivity(activityId);
}
}
This is slightly different from how you specify in your example. The usage here would be:
<activity-photo></activity-photo>
and activity photo would find the activity id on its own.
Alternatively, you could create a controller for the view, but I guess you would need to wrap your template with another tag... Ex:
<div id="activity-view">
<activity-photo activity-id="ctrl.activityId"></activity-photo>
</div>
.
@NgController(
selector: '#activity-view',
publishAs: 'ctrl')
class ActivityViewController {
String activityId;
ActivityViewController(RouteProvider routeProvider) {
String activityId = routeProvider.parameters['activityId'];
}
}
Upvotes: 2