简体   繁体   English

AngularJS重定向到另一个ng-app模块

[英]AngularJS redirecting to another ng-app module

newbie to AngularJS here. 这里是AngularJS的新手。

I created one AngularJS application using Yeoman, grunt and bower. 我使用Yeoman,grunt和bower创建了一个AngularJS应用程序。

The index page contains some style and ng-app and ng-view. 索引页面包含一些样式以及ng-app和ng-view。

index.html 的index.html

<html>
  <head>
      <!-- CSS Imports -->
   </head>
   <body ng-app="MyApp1">
      <div>
          //Some divs here to  have some styles

          <div ng-view></div>
      </div>
    </body>
    <!--importing AgularJS, app.js, controller JS files -->
</html>

app.js app.js

'use strict';

angular.module('MyApp1', [])
  .config(function ($routeProvider,$locationProvider) {
    $routeProvider
        .when('/', {
          redirectTo: '/main'
        })
      .when('/invoice', {
        templateUrl: 'views/invoice.html',
        controller: 'UploadController'
      })
      .when('/main', {
        templateUrl: 'views/main.html',
        controller: 'MainCtrl'
      })
      .when('/login', {
            templateUrl: 'views/login.html',
          })
      .otherwise({
        redirectTo: '/main'
      });
//    $locationProvider.html5Mode(true);
  });

    angular.module('LoginApp', [])
    .config(function ($routeProvider,$locationProvider) {

    });

The index page has ng-view that will display invoice.html or main.html. 索引页面具有ng-view ,将显示invoice.html或main.html。 Default is main.html . 默认值为main.html main.html main.html中

<div class="hero-unit">
  <a ng-href="views/login.html" target="_self">Login</a>
  <br>
  <a ng-href="#invoice">New Document</a>

</div>

Ok. 好。 In this main.html , I have two links. 在这个main.html ,我有两个链接。 Second is a link to invoice. 第二个是发票链接。 That anyway will display inside index.html ng-view . 无论如何,它将显示在index.html ng-view内部。 The controller UploadController belongs to MyApp1 module. 控制器UploadController属于MyApp1模块。 And it has separate JS file. 并且它具有单独的JS文件。 It is working fine. 一切正常。

The first link is to another HTML page. 第一个链接是另一个HTML页面。 Its login.html . login.html It has another ng-app called LoginApp . 它还有另一个名为LoginApp的 ng-app Both the modules are independent and in diferent pages. 这两个模块都是独立的,并且在不同的页面中。

When I click on the first link, it goes to login.html . 当我单击第一个链接时,它将转到login.html But in the URL it shows like http://localhost:9000/views/login.html . 但是在URL中,它显示为http://localhost:9000/views/login.html But I want it to be shown like http://localhost:9000/login , just like for other main.html ( http://localhost:9000/#/main ). 但是我希望它像http://localhost:9000/login ,就像其他main.html( http://localhost:9000/#/main )一样。 When I edited the link like <a ng-href="#login">Login</a> it is not working. 当我编辑<a ng-href="#login">Login</a>之类的链接时,它不起作用。

And also $locationProvider.html5Mode(true); 还有$locationProvider.html5Mode(true); is not working for me. 对我不起作用。

Put the login.html to same folder like index.html. 将login.html放在与index.html相同的文件夹中。

I think it's not possible to route to another module. 我认为不可能路由到另一个模块。 However this route rule for login.html will not working for (external) page. 但是,login.html的此路由规则不适用于(外部)页面。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM