Usually I use ui-router state with id parameter like this:
/* route /news/{news_id} */
http://servername/#/news/14
but already I want to use alias string instead of id like this:
/* route /news/{news_title} */
http://servername/#/news/braking-news-of-usa
How to map news_title to news_id in angular or ui-router?
I don't think this specific to Angular, but you can consider following approaches.
Along with title append news id with some separator. e.g. breaking_news_of_usa_14. When someone clicks that link, in Javascript split the news title and retrieve the ID to query server API.
Make sure you have unique titles for news (overhead at serverside API e.g. unique index, hashes etc.) and instead of querying with news id, query using news title to get the details.
Maintain both news ID and news title like this /{news_title/{news_id}. With this you save overhead of introducing unique titles. (Reference, check stackoverflow URL format for question details.)
Related
I searched for this but I could only find examples in Laravel and PHP, and I need to know how to do this with Next.js.
All I know is that I can do dynamic routes in Next.js the usual way like this ...
/pages/post/[postId] which will translate to /pages/post/23435 for example, and that way if someone has the URL I could just grab the [postId] with router.query and can show the correct post to the user, easy enough.
But what if I want to show the post name in the URL instead of the id? just like what Udemy does with dashes between the words ...
https://www.udemy.com/course/your-custom-react-component/learn/lecture/
And at the same time if someone has that URL I could still show the correct post to them?
I know I could just do /pages/post/[postName] and show the post name in the URL, but that won't be unique, and won't be able to show the correct post.
How can I do that?
You can to do it with postName as you propose, and then take care that postNames are unique and that each one maps to a postId (that's something you need to deal with on your side; so in your database you would generate a unique slug for each postName)
Another solution would be to show both the name and the id like /pages/post/[postName]/[postId]. You can use several params, check https://nextjs.org/docs/routing/dynamic-routes
if we use object id of mongodb in query parameter like for example,
in browser url,
http://example.com/get-details/507f191e810c19729de860ea
to pass this objectID from one state to another state, I am using $stateparam
then,in $http
the url will be
"/get_details?id="+$stateParams.detail_id
$http.get("/get_details?id="+$stateParams.detail_id).then(...);
if there any problem with the url in browser in terms of SEO, i.e, http://example.com/get-details/507f191e810c19729de860ea what could be the solution
It's OK to use MongoDB Object ID as a primary key in a URL, in terms of SEO.
Also please consider including a slugified title along with the Object ID in the URL:
http://example.com/detail/<Object-ID>/<Slug>
It makes the URL more readable and helps search engines to determine the content of your page.
I have a table view with a form above it for doing advanced search (text fields, date ranges, drop down lists etc.)
I am trying to store this state in the URL using `$location.search('filters', angular.toJson($scope.filters)); but was wondering if there is a better way.
The reason I want to make use of the URL is so people can share links to filtered data.
This is a perfectly valid use case for $location.search, but you don't need to do an angular.toJson. $location.search accepts an object as its parameter and will automatically convert it into an encoded query string before applying it to the URL.
I would like to create url paths for entities based on their titles.
For example, if the title of a Book entity is "Romeo and Juliet", I'd like the URL paths to be
http://example.com/book/romeo-and-juliet
Additionally, how would I handle this URL path if the book title is "Romeo & Juliet". Finally, is it recommended to use this approach, or should I just create URL paths using the entity's ID, like this:
http://example.com/book/4644337115725824
Grateful for any advice.
Depends on how you retrieve the book. App engine uses ndb and the key for each book should be unique. So there will be a difference between "Romeo & Juliet" and "Romeo and Juliet".
Also you will need to provide a way of uniqueness for every title and regarding books containing the same title (eg different countries) that will be hard.
An approach would be to use both. Generated id and a title like
/12345678/mybook
According to your comment then you are not puzzled by iniquity but SEO and url friendly strings. I recommend a search on that and you find more than you need. I am not an expert on URL firendly urls but they are cumbersome, and need escaping rules etc.
eg 'romeo & juliet' will have to be escaped due to spaces and the '&'.
So then you end up with creating conventions for your app. A simple rule for you example would be:
Replace '&' with 'and' on titles
Replace ' ' (spaces) with underscores '_'
...
So you will be ending up with 'romeo_and_juliet' which is far more url friendly than 'romeo&juliet'.
If escaping strings in your concern mainly then use:
encoded_param = urllib.urlencode(book_title)
I like use urls like
/books/[key]/romeo_and_juliet
where [key] is the book key, either a string or an id.
I have a field in a cms called 'services' the services is a lsit of checkboxes with the values
1|digital
2|web
3|print
4|apps
The issue is each of the options has a related url. Is there way to link a url to a 'service' or am I looking at taxonomy to solve this issue?
You need to use a taxonomy. A select list is simply a key/value pair with no other additional data. If you build a new taxonomy, you can either use the taxonomy URL for your purpose or you can add a Link field and give each term a specific URL and tie that in somehow, maybe through Views or a custom display.