Is there a way to incorporate Django Swagger Documentation or some form of built-in documentation directly on the Angular frontend? I want users to be able to access the API endpoints by clicking on a documentation button on the landing page, without being redirected to a different domain. Currently, I can redirect users from frontenddomain to backenddomain/doc, but this opens a new tab in the browser which is not ideal. Are there any alternative solutions apart from using Swagger? My main goal is to display all API endpoints on the landing page for the user. Any suggestions?
UPDATE
I am familiar with routing to other components, but I am specifically looking to embed documentation within one of these components. Alternatively, are there better solutions available? Currently, I have implemented something along the lines of what is shown below. However, it directs the user to another domain. I would prefer a solution like this [routerLink]="['/cloud']" where /cloud contains my Swagger documentation. If more information is needed, please let me know. I hope you understand my objective.
</li>
<li class = 'nav-item' *ngIf="!isDocumentation() && !sidebarVisible && !isWelcome()">
<p class='sidebar-false-documentation' *ngIf="isCloud()">
<a href="http://localhost:8000/doc" class="nav-link" target="_blank"><i
class="nc-icon nc-book-bookmark"></i>Documentation</a>
</p>
</li>