Angular JS - 使用相同路由提供程序的两个应用程序的常见问题

Question

嘿所有，感谢阅读。  我有一组客户端文本模糊，我想用ng来浏览视图。  我的问题是，虽然我觉得我已正确设置，但我只看到第二个视图上的第一个视图重复，并且在第一个视图锚点上失去了更改文本模糊的功能。  我想知道是否有人可以为我揭开它。  自从我做了一些angularJS以来，我已经有一段时间了，我忘了它有多么有趣但砖墙可以。 我发布了下面的app.js代码

var animateDesign = angular.module('animateDesign', ["ngAnimate", "ngRoute"]);
  animateDesign.config(['$routeProvider', function($routeProvider){
  $routeProvider.
      when('/background', {templateUrl: './assets/views/design/background.html',
	  						  css: ['./assets/vendor/bootstrap-3.2.0-dist/css/bootstrap.min.css', 'assets/css/after_bs.css']}).
      when('/logo', {templateUrl: './assets/views/design/logo.html',
	  						  css: ['./assets/vendor/bootstrap-3.2.0-dist/css/bootstrap.min.css', 'assets/css/after_bs.css']}).
      when('/branding', {templateUrl: './assets/views/design/branding.html',
	  						  css: ['./assets/vendor/bootstrap-3.2.0-dist/css/bootstrap.min.css', 'assets/css/after_bs.css']}).
	 when('/illustration', {templateUrl: './assets/views/design/illustration.html',
	  						  css: ['./assets/vendor/bootstrap-3.2.0-dist/css/bootstrap.min.css', 'assets/css/after_bs.css']}).
      when('/print', {templateUrl: './assets/views/design/print.html',
	  						  css: ['./assets/vendor/bootstrap-3.2.0-dist/css/bootstrap.min.css', 'assets/css/after_bs.css']}).
      when('/web', {templateUrl: './assets/views/design/web.html',
	  						  css: ['./assets/vendor/bootstrap-3.2.0-dist/css/bootstrap.min.css', 'assets/css/after_bs.css']}). 
      otherwise({redirectTo: '/background'});
}])
.animation('.reveal-animation-design', function($scope) {
  return {
    enter: function(element, done) {
      element.css('display', 'none');
      element.fadeIn(1500, done);
      return function() {
        element.stop();
      }
    },
    leave: function(element, done) {
      element.fadeOut(1500, done)
      return function() {
        element.stop();
      }
    }
  }
});

angular.bootstrap(document.getElementById("animatePrint"), ['animatePrint']);

var animatePrint = angular.module('animatePrint', ["ngAnimate", "ngRoute"]);
  animatePrint.config(['$routeProvider', function($routeProvider) {
  $routeProvider.
      when('/litho', {templateUrl: './assets/views/print/litho.html',
	  						  css: ['./assets/vendor/bootstrap-3.2.0-dist/css/bootstrap.min.css', 'assets/css/after_bs.css']}).
      when('/digital', {templateUrl: './assets/views/print/digital.html',
	  						  css: ['./assets/vendor/bootstrap-3.2.0-dist/css/bootstrap.min.css', 'assets/css/after_bs.css']}).
	  when('/other', {templateUrl: './assets/views/print/other.html',
	  						  css: ['./assets/vendor/bootstrap-3.2.0-dist/css/bootstrap.min.css', 'assets/css/after_bs.css']}).
      otherwise({redirectTo: '/litho'});
}])
.animation('.reveal-animation-print', function() {
  return {
    enter: function(element, done) {
      element.css('display', 'none');
      element.fadeIn(1500, done);
      return function() {
        element.stop();
      }
    },
    leave: function(element, done) {
      element.fadeOut(1500, done)
      return function() {
        element.stop();
      }
    }
  }
});

我也会发布html实现，因为它可能只是调试失明而且可能是最简单的事情

    <div class="col-md-6">
                    <div class="container">
                        <div ng-app="animateDesign">
                            <div class="wrapper">
                                <div ng-view class="reveal-animation-design"> 
                                This is the background area                 
                                </div>
                            </div>
                        </div>
                    </div>        
                </div>
            </div>
    </div>
        <!--/.container-->
	</div>
    <!--/#design-->
    
    <div id="print" class="page-section">
        <div class="container">
        <h2> Print </h2>
            <div class="row">
                <div class="col-md-3 no-float">
                     <!--start Vertical Header Test-->
                     <nav class="navbar navbar-left" role="navigation">
                              <!-- Brand and toggle get grouped for better mobile display -->
                           <div class="navbar-nav">
                                <button type="button" id="nav-toggle" class="navbar-toggle" data-toggle="collapse" data-target="#alt-nav">
                                <span class="sr-only">Toggle navigation</span>
                                <span class="icon-bar"><img src="assets/img/png/dd-logo-basic-sm.png"/></span>
                                </button>
                           </div>                            
                              <!-- Collect the nav links, forms, and other content for toggling -->
                           <div id="alt-nav" class="collapse navbar-collapse">
                                <ul class="nav navbar-left">                  
                                   <li><a href="#/litho">litho</a></li>
                                   <li><a href="#/digital">digital</a></li>
                                   <li><a href="#/other">other</a></li>
                                </ul>
                           </div><!-- /.navbar-collapse -->
                     </nav>        
                </div>
                <div class="col-md-6 no-float">
                     <div class="container">
                     <!--this is not showing on the page TODO: animatePrint needs to show on page, before using id="animatePrint" and having a default otherwise call to be the background-->
                          <div id="animatePrint">
                              <div class="wrapper">
                                    <div ng-view class="reveal-animation-print">                  
                                    </div>
                              </div>
                          </div>
                     </div>        
                </div>
            </div>
            <!--/.row-->
        </div>
        <!--/.container-->
     </div>
     <!--/.print-->

提前感谢您提供有关此问题的任何帮助。 干杯，再次感谢阅读：）

P.S＆GT;有人可以帮助我/指导我格式化代码，似乎它不会接受我的第一个声明行后的代码行 - sry仍然有点新。 我不得不添加一个片段，以获得任何成功发布 - （我noob）

Gruffy：）