Is it possible to have a controller that keeps its state alive and also responds to routes?
For example I would have a PlayerController that I initiate in the application's initControllers method and then I will need it also to respond to a route like /player/trackID so I can change the current playing track.
Yes, you can create a controller which will be active for the lifetime of the application. As you mentioned instantiate PlayerController in initControllers method of the application and in routes.js define the route /player/:trackID to be bound to a specific method of the PlayerController.
e.g. route in routes.js will look like
match('player/:trackID', 'player#playTrack', {name:'playtrack'});
In the above route playTrack is the method of PlayerController.
Related
I am trying to create an new react app. I have 3 components: app (with login functionality) , admin and client.
How can I render (redirect to) admin / client based on a value (user role) , after successfully login?
Is this any way to access the admin / client components directly from the URL? More specific, localhost:3000 takes me to App.js (witch makes sense, because it is defined like this in index.js). If I want to see directly the admin component (hijacking the login), can I use for example localhost:3000/admin ? how can I do that?
Thank you !
You can use react router and in particular route.push('/admin')
You need to define the '/admin' route and voilà.
To bypass the login, you may want to make a 'test-admin' route and a private 'admin' route. Here is how to make a private route if you happen to need it:
https://dev.to/karanpratapsingh/private-public-and-restricted-routes-in-react-42ff
You can use react-router, that allow to define some route based on URL.
When you have a login feature, then you would probably wants to have some protected route, that are only accessible when you are logged in.
Then I recommend you to read this article
I am learning Angular 7 by studying this example app. The example app uses a wildcard route to handle all otherwise-unhandled routes.
Specifically, this app-routing.module.ts directs all miscellaneous routes to AppConfig.routes.error404, which is handled by Error404PageComponent.ts, which then ultimately serves up error404-page.component.html for every possible route that is not specified by its own component and named route.
What specific changes would need to be made to the code in this sample app in order for the wildcard route serve different static content for different submitted routes?
For example, if a web user typed in the route /i-am-a-jelly-donut, what changes would need to be made so that the request would 1.) continue to go through Error404PageComponent.ts, but have the user's browser receive a new i-am-a-jelly-donut.page.html instead of the error404-page.component.html view?
The Error404PageComponent.ts would still serve up error404-page.component.html for every non-specified route. However, we would be adding logic to give special handling inside Error404PageComponent for a specific static route in addition to the logic for every non-specified route.
The goal here is to be able to handle static routes without having to create a separate component for each and every route. Think, for example, of a blog where most of the routes have an identical template, but with different content in each blog entry.
Templates are compiled into the components at build time and you are not going to be able to change which template a component uses at runtime but you can hide and show sections based on conditions. Inject the router into your component
constructor(private router: Router) {}
Now you can set a variable on your component based on if the route contains 'i-am-a-jelly-donut'
jellyDonut = this.router.url.indexOf('i-am-a-jelly-donut') !== -1;
and in your template
<ng-container *ngIf="jellyDonut">
Jelly Donut
</ngcontainer>
<ng-container *ngIf="!jellyDonut">
Other stuff
</ngcontainer>
We are following this pattern in which every function requesting to server is written in a service in angular application.
Then in controller we call that function like this -
suppose- service name is - homeService
then we use it like this -
homeService
.getUserName()
.then(getUserNameSuccessCallback, getUserNameErrorCallback);
I wanted to know if the server request is taking long and the user goes to other state, like home to profile so home controller would be destroyed and profile controller would be initialised,would the callback be still fired if the request to server is returned.
As we work in angular when we route from one url to another then controller data is Rest but service data is not reset.
Can someone please explain why its not reset. Any help is appreciated.
Thanks
Services are only instantiated once and every component depending on the service gets the same shared instance of it. Services are not "reset"/destroyed/torn down, they're permanent. Controllers are bound to scopes and come and go with the scope.
This in fact allows you to have a constant "backend" in the form of services which retain their state throughout the entire life cycle of the app, while controllers are temporary things bound to views which come and go as the GUI changes.
Angular services are:
Lazily instantiated – Angular only instantiates a service when an
application component depends on it.
Singletons – Each component
dependent on a service gets a reference to the single instance
generated by the service factory.
You can read more about it in Angular's documentation: https://docs.angularjs.org/guide/services.
This issue was a bit old but let me share on how I did to delete my data stored in service.
service.ts
data: any;//I made a storage variable like this so it will be undefined value by default
removeProductData() {
this.data= undefined;
}
//In your component just call this function `removeData()` wherever you want to delete your data.
I can't display items from my collection on a page in my MeteorJS app.
I am using aldeed:autoform and iron:router.
In my JS console I always see on page load:
pathFor couldn't find a route named undefined
I have published and subscribed to the collection and written a helper function which should make the data accessible from the relevant template. Do I need to do something different when using Autoform and iron:router?
You need to define a route in iron router with the given path name. Something like:
{{pathFor 'someRouteName'}}
And a route defined as follows:
Router.route('someRouteName');
in your router.js file.