C'est tout. Mon application est divisée en frontend (accueil) et utilisateur backend (utilisateur). Selon le didacticiel de base, index.html est utilisé comme page d'accueil et également comme mise en page globale.
La structure générale de mon projet est la suivante :
app
app.js
routes.js
views
home
about
index.html
login
index.html
layout.html
user
dashboard
index.html
articles
index.html
detail.html
layout.html
index.html
Ce que je pense maintenant, c'est que les modèles sous vues/home héritent de vues/home/layout.html, et il en va de même pour vues/utilisateur.
En prenant vues/home/about/index.html comme exemple, l'URL de routage ressemble à ceci :
$routerProvider.when("/about",{
templateUrl : "views/home/about/index.html"
});
Le problème maintenant est que app/views/home/about/index.html
hérite directement de app/index.html
, et je veux qu'il hérite comme ceci :
app/views/home/about/index.html
-> app/views/home/layout.html
-> app/index.html
->
======
J'ai trouvé un plug-in tiers appelé angulaire-ui-router, qui peut remplacer angulaire-routeur et réaliser cette fonction.
Vous avez fait le bon choix.
Cela ressemble beaucoup à la structure de MEAN.JS, vous pouvez vous y référer.
Transformez tous les éléments de la page en directives, placez les relations d'héritage et d'imbrication dans les directives et utilisez plusieurs directives en combinaison sur une seule page.