Add custom view to jhipster app

Question

I would like to add a custom view to jhipster app on index.html

I already created the link in navbar.html and added the html file on path src/main/webapp/scripts/app/custom/newView.html

 <a ui-sref="newView" data-toggle="collapse" data-target=".navbar-collapse.in">
     <span class="glyphicon"></span>
     <span class="hidden-sm">new view</span>
 </a>

When I click on the link it doesn't work. Probably it needs a custom route in angular but I can't figure out how to create it. What else should I do?

Answer 1

In addition to the other answer, here is another piece of information. Maybe somebody else will find it useful. I had a similar problem with a custom view but only in production. Everything was fine in dev mode. In production mode, nothing would display and I had this javascript error that read "could not resolve ... from state ...". It turns out that my javascript file (where the state was declared) was declared like this in index.html

<!-- build:js({.tmp,src/main/webapp}) scripts/app.js -->
<script src="scripts/app/app.js"></script>
<script src="scripts/app/app.constants.js"></script>
...

<!-- endbuild -->

<!-- custom -->
<script src="scripts/app/pages/quizz/quizz.js"></script>
<script src="scripts/app/pages/quizz/quizz.controller.js"></script>

I had created the separation on purpose, just to make it easier to read. Once I moved it up to have it before endbuild, the problem disappeared. I guess this is related to how the app is packaged somehow? I haven't looked at how it does it.