Le routage dans Angular 7 s'exécutant dans le sous-dossier ne fonctionne pas correctement

Nous travaillons à la migration de notre application vers une nouvelle version Angular. L'ancien (Angular.JS) était sa propre application / dépôt servie par une application ASP.NET MVC .NET Framework 4.5.2 qui acheminerait chaque appel vers Home qui renverrait une vue Razor qui contenait l'application angulaire, puis démarrez-la, en acheminant éventuellement le suffixe de l'URL vers la page angulaire réelle. Par exemple, il acheminerait www.website.com/profile vers la route profile dans Angular, sans essayer d'accéder à un dossier appelé profile sur le serveur. L'intégration de notre API et de l'application Angular.JS n'est pas trop jolie mais cela a fonctionné. Le serveur a également des dossiers virtuels dans IIS pour d'autres sous-dossiers auxquels il faut accéder comme les polices, les images, les configurations, etc.

Actuellement, je travaille à faire fonctionner l'application Angular 7 avec l'application Angular.JS. Nous voulons exécuter l'application Angular 7 pour qu'elle s'exécute dans un répertoire de l'application actuelle, puis la déplacer vers sa propre application Web, car notre nouvelle application Angular n'est qu'un tas de fichiers statiques et n'a pas besoin d'être fournie avec le serveur. plus. En gros, aucune configuration ASP.NET MVC n'est nécessaire.

L'URL actuelle serait www.website.com et renverrait l'application Angular.JS. Le nouveau serait www.website.com/v2/ et renverrait l'application Angular 7. Si nous avions terminé une version v2 de la page profil , la navigation vers wwww.website.com/v2/profile devrait maintenant accéder au profil page de l'application Angular 7.

Dans IIS, l'un des dossiers virtuels est un dossier appelé dist qui mène à l'emplacement des fichiers de l'application Angular.JS. Un nouveau appelé v2 est maintenant configuré, ce qui conduit à l'emplacement des fichiers de l'application Angular 7. Un autre appelé assets mène au dossier assets de l'application Angular 7.

Maintenant, quand je navigue vers www.website.com / v2 / , Angular démarre et me dirige vers www.website.com/v2/home , qui est la route d'origine.

Le problème est que lorsque je saisis moi-même www.website.com/v2/home , l'application revient à www.website.com . et ainsi il redémarre l'application Angular.JS. Il n'y a aucune erreur ou redirection en cours. Il semble qu'il ignore simplement la partie qui suit la partie v2 / même si Angular.JS le fait très bien.

TL; DR Navigation vers www.website.com/v2 charge Angular 7, mais la navigation vers v2 / {{Anything}} entraîne le retour de l'application vers l'application Angular.JS en cours d'exécution sur www.website.com , même si {{quelque chose}} était un lien interne dans Angular 7, il naviguerait vers le {{any}} route.

Je construis le projet Angular avec la commande suivante:

ng build --configuration = dev --deploy -url = / v2 / --base-href = / v2 /

Les routes dans l'application angular 7 ressemblent à ceci:

 <rewrite>
      <rules>
        <clear />
        <rule name="Redirect Angular endpoints to MVC Home" enabled="true">
          <match url="^(profiel|timesheets|facturen|opdrachten|contact|help|gebruikers)" negate="false" />
          <conditions logicalGrouping="MatchAll" trackAllCaptures="false" />
          <action type="Rewrite" url="Home" logRewrittenUrl="false" />
        </rule>
     <!-- Some other rules that are not important are here, they redirect HTTP to HTTPS -->
     </rules>
  </rewrite>

Quelqu'un peut-il me dire comment je peux, par exemple, taper www.website.com/v2/contact dans le navigateur pour accéder à la page de contact v2, tout en rendant possible la navigation interne (donc si l'utilisateur clique sur "accéder au contact v2 p age "à l'intérieur de l'application Angular 7, il permet également d'accéder à la page de contact v2)

Edit: Informations sur Angular.JS Routerconfig et le back-end web .config ont été demandés; Je les ai fournis ci-dessous.

RouterConfig:

$routeProvider
    .when('/', {
      templateUrl: 'scripts/home/home.html',
      controller: 'HomeController',
      controllerAs: 'homeCtrl'
    })
    .when('/gebruikers', {
      templateUrl: 'scripts/users/users.html',
      controller: 'UsersController',
      controllerAs: 'usersCtrl'
    })
    .when('/profiel', {
      templateUrl: 'scripts/profile/profile.html',
      controller: 'ProfileController',
      controllerAs: 'profileCtrl'
    })
    .when('/timesheets', {
      templateUrl: 'scripts/timesheets/timesheets.html',
      controller: 'TimesheetsController',
      controllerAs: 'timesheetsCtrl',
      reloadOnSearch: false
    })
    .when('/facturen', {
      templateUrl: 'scripts/invoices/invoices.html',
      controller: 'InvoicesController',
      controllerAs: 'invoicesCtrl',
      reloadOnSearch: false
    })
    .when('/opdrachten', {
      templateUrl: 'scripts/vacancies/vacancies.html',
      controller: 'VacanciesController',
      controllerAs: 'vacanciesCtrl'
    })
    .when('/contact', {
      templateUrl: 'scripts/contact/contact.html',
      controller: 'ContactController',
      controllerAs: 'contactCtrl'
    })
    .when('/help', {
      templateUrl: 'scripts/help/help.html',
      controller: 'HelpController',
      controllerAs: 'helpCtrl'
    })
    .otherwise({
      redirectTo: '/'
    });

Règles de réécriture Web.Config IIS:

XXX