13 comments found.
Hello. What Angular Version you are using on this project?
Hello. Angular 9.
Hello. I’m training on Angular, so I don’t have all the keys in hand yet. In fact, at the level of the list of projects, when clicking on a project, I would like to direct to a dynamic page of the project in question, which would indicate the data of the project in question (found in projects.json). I consulted the Angular doc, trying different things with the routing, whether in project-component or project-preview component. I suspect that the solution requires to retrieve the info according to the id to display it on a given page, but I do not see how to do that. Could you enlighten me on this?
Thank you so much. Best Regards,
There are two solutions. 1. Make a separate page for each project. Replace line {path: ‘project /: id’, component: ProjectComponent, data: {animation: ‘project’}}, on the {path: ‘project / project1’, component: ProjectOneComponent, data: {animation: ‘project’}}, {path: ‘project / project2’, component: ProjectTwoComponent, data: {animation: ‘project’}}, ...
2. Add the necessary information to projects.json. In the component ProjectComponent, request information from the projects.json file by id.
Regards, Alexey.
Hello, thank you for your clear and fast response. I would prefer to opt for the second solution, which seems better to me from a code refactoring point of view (I just need to display some information on each page). What I can’t do is iterate over each JSON object according to their id (I tried to store them in an array and filter with find, but nothing to do). I obviously imported the JSON data into the project component. How to proceed ?
Best regards,
Hello. Need to get json via http service. Then use pipe(filter(i => i.id === yourId)) to get the desired entry. Tomorrow I can write in more detail.
Regards, Alexey.
Add this method to get-data.service.ts, and run when you need to get project by id. getProjectById(id: number): Observable<ProjectModel> { return this.http.get<ProjectModel[]>(’/assets/data/projects.json’) .pipe(map(p => p.find(item => item.id === id))); }
Hello. Thank you very much for your clear follow-up and your concrete solutions. I added the method to get-data-services, but after many tests on my gits branches I think I know what’s wrong: I get info from a project with the ProjectPreview component, itself a child of ProjectList. Since Project has no logical relationships with either of the other two components, it is normal that I cannot retrieve data by string interpolation. How then (approximately), so that when clicking on a ProjectPreview, it redirects to a project page template with the dynamic data of each project? The modification is to be made at which component?
Thank you for your time and support.
Best regards,
Hello. You need modify project.component.ts. Write in ngOnInit
this.projectId = +this.router.url.split(’/’).slice(-1)[0]; this.getData.getProjectById(this.projectId).subscribe(console.log);
Don’t forget to create projectId and import Router.
Today I will update the application according to your wishes.
Updated the application. Once it passes the review, you can download it and see the changes.
Hi there, I accidentally purchased this instead of the react version, please could you help here?
Hi Ryan. To return your money you need to write to themeforest support. All money transactions are handled by themefores.
Hi guys,
Did you deploy project to heroku successfully?
I try deploy project to heroku but i get error message not found and an error in console of browser like this “Content Security Policy: The page’s settings blocked the loading of a resource at https://mrkhanh.herokuapp.com/favicon.ico (“default-src”).” Could you help me the way to fix this issue ?
Thank you
Hello. Maybe this guide will help you https://www.codemeals.com/angular-tutorials/deploy-angular-7-app-to-heroku/
Hello Team, How to deploy project to heroku ? I try to deploy project to heroku, but i get error message like this “Content Security Policy: The page’s settings blocked the loading of a resource at https://mrkhanh.herokuapp.com/favicon.ico (“default-src”).”
Hello. Maybe this guide will help you https://www.codemeals.com/angular-tutorials/deploy-angular-7-app-to-heroku/
Have you read the deployment instructions – https://angular.io/start/deployment ?
Здравствуйте. Классный шаблон. Два вопроса 1. Титл один для всех страниц? 2. Механизм отправки сообщений через форму прописан или нужно свой прикручивать?
Здравствуйте. Спасибо. Title сейчас один для всех страниц, но это можно изменить. Подробнее в этой статье https://www.truecodex.com/course/angular-6/how-to-set-dynamic-page-title-and-meta-tags-in-angular-6-angular-7-for-seo Для отправки форм нужно подключить собственный скрипт, т.к. у разных людей разные скрипты либо сервисы для отправки писем.
Спасибо, за быстрый ответ. Без проблем. с титлом и формой разберемся. GLWS
Nice work! I want to add little notes; you add create a price table.
Thanks for the advice, but what is the pricing table for?
I talked about for the theme
Congratulations!!! Nice Work, Good Luck With Sale 
Thank you!)
Nice Work, GLWS
Thank you!)
