Is there any way to get to see the data in the UI of strapi if the components made are nested till third level so that I can make changes there only and does not have to go to database all the time for data changes.The image shows a link components wihich has three three files inside it and the component itself is wrapped under a component which is again wrapped into another one and so on...it has the data in it but is not visible in the UI
I tried contacting the community but if someone figured out a solution by itslef do help as we are at production level now and this cms is to be used by non-technical people now who has no idea of what Database is...
If you are able to add data that is more than 2 levels deep and the only problem you are facing is that you can't see the nested JSON in the API response, I would suggest taking a look at
https://www.npmjs.com/package/strapi-plugin-populate-deep.
After installing it properly, you will just have to use you can use it as follows:
Populate a request with the default max depth.
/api/articles?populate=deep
Populate a request with the custom depth
/api/articles?populate=deep,10
Populate a request with the custom depth and filter
/api/articles/1?populate=deep,10
Related
I am trying to use both components in my angular application. I am a backend developper and absolutely newbie in angular. I have been reading the roles and users components in the source code and I think I cloned it for my Customers component. I have guards, defaults and all the code like Roles and Users but, although the code compiles and the API call is done, I have nothing in the screen, only the Total records are displayed. No action buttons, no table rows, no pagination...
Is there anyone who has use these components and can bring me some help?
Many thanks
Those components are needed for customizing built-in modules. Let's talk about Users for example. The Users component is a built-in page and you do not have access to its code. However, you may still need to make some changes like adding a New User button on the toolbar or changing its columns, form fields etc. That's why ABP Framework provides some injection tokens to override/extend/customize these features. Since you are developing your own page, you do not need any of this. You can directly use ngx-datatable in your own component, add or remove columns and so on.
Let's say I have a blog made in Next.js by consuming a REST API from a headless CMS. I know how to load posts and so on. But where do I load the basic website info such as name and color? I thought about loading it on _app.js but when I define loadStaticProps() on it, the nested loadStaticProps() on another components doesn't get called and when using another kind of data loading, such as using Axios, the site wont be truly static. What is a good way for doing it? Thanks.
I think there are multiple questions here
But where do I load the basic website info such as name and color?
I am interpreting the question so you may want to add more details to complete the answer. You have two options when using data that is truly static in nature.
You can use the post mechanism to create a website info that you can load as a specific call
You can store the static information in a separate file in the server and read it off and update the data via a git update which will reflect on the site. If this won't change often, e.g: a website name - You can use getStaticProps to get this information at build time
I thought about loading it on _app.js but when I define loadStaticProps() on it, the nested loadStaticProps() on another components doesn't get called and when using another kind of data loading, such as using Axios, the site wont be truly static. What is a good way for doing it?
Page data that is truly global can be fetched via _app.js + getStaticProps seems to be a long running open issue - You can follow the thread here and one potential workaround here - https://github.com/vercel/next.js/discussions/10949#discussioncomment-6148
I'm new to AngularJS, and i'm want to know what's the best and easiest practices to do this simple shop list application.
So this is my shop:
I got three servers in my select input. Each server got own list of items, displayed in another component.
I'm thinking about creating routes with variables like localhost:4200/shop/{server1} which gonna show my list of items based on url path. Select option will just change path in my application to show shop list for specific server.
Is it a good practice, or there is better and easier solution to implement this simple shop application?
If you're asking if filtering data with routing is a good practice with Angular, I can say that it is not a bad one. Here's a link to the official Angular documentation about routing : Angular - Routing
But if you're asking if it is the only way to filter data or spread parameters, the answer is clearly no. Angular projects are SPA (Single Page Application), so you can do everything without touching the url.
For a quick example, you can attach a (click) event on your elements that display the shop list you want
I think you can use just one component and three different click events to display three different results. One component can work in your case. Using a router and routing logic for your requirement will be a costly affair. Your user will have a better application feel if these are covered in just one component and with three different click events.
I'm confused
it seems there is 2 way to run reactjs projects
1. in browser between html and script tags
2. not between html and script tags(it runs on browser) but it's different
I'm confused. explain it to me plz
React is a technology that is rendering custom web components into the browser, when you have a view, let's say dashboard composed of multiple React components, you have two ways to display that to a user:
1/ you display the html that typically contains the root React element and load an associated JavaScript script which contains all the React logic, then fetch the required data of that dashboard, so it will render all your graphs and stuff.
2/ when the user request that specific page, your server application already knows which data are required to render the initial view, so it will compute in advance how the page looks like and send a final first version to the user, it is called server-side rendering. From there obviously the page can be dynamically modified by local JavaScript running in browser afterwards, based on user interaction.
Both approaches have pros and cons, like testing capabilities, speed of execution, and so on... so I encourage you to read about the topic on the web, you can find tons of articles on React server-side rendering that will explain that better than me:
https://www.smashingmagazine.com/2016/03/server-side-rendering-react-node-express/
https://github.com/mhart/react-server-example
I have a tab in my Ionic project which consists of a map. On that map, the user can pan around and do things such as draw polygons, etc.
However, when the user moves to another tab and comes back, the map is completely reset and all his work is gone, because Angular seems to destroy the state. In addition, another request will have to be made to the map tile server because of this, which can be expensive (financially) for the company.
Is there a way to tell Angular not to reset the state when navigating from tab to tab? Or perhaps this project isn't a good fit for Angular based technologies?
I am not sure how the map is being created in your scenario, but have you tried nesting your states? http://angular-ui.github.io/ui-router/ has a great example of a nested state that shares data between them. You might also look into the $cacheFactory service: https://docs.angularjs.org/api/ng/service/$cacheFactory and use it to store and retrieve your map.