角度UI路由器路由配置不起作用

我正在使用UI路由器爲我的新應用程序做路由。我有我的狀態爲主頁定義。我在我的頁面中鏈接了「註冊」，它需要作爲單獨的狀態作爲模式窗口打開，我使用「onEnter」觸發模式窗口。當用戶點擊模式窗口的關閉按鈕時，我希望用戶被重定向到主頁狀態。我能夠使用「ui-sref」回到主頁狀態，但無法關閉模式窗口。我試着用data-dismiss =「modal」。我做錯了什麼？角度UI路由器路由配置不起作用

下面是我努力的配置：

的index.html

<!DOCTYPE html> 
<html> 
    <head lang="en"> 
     <meta charset="UTF-8"> 
     <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 
     <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"> 
     <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" /> 
     <meta http-equiv="Pragma" content="no-cache" /> 
     <meta http-equiv="Expires" content="0" /> 
     <title>Idea Generation App</title> 
     <!-- inject:css --> 
     <link rel="stylesheet" href="app/styles/css/bootstrap.min.css"> 
     <link rel="stylesheet" href="app/styles/css/ideaManagementUI.css"> 

     <!-- endinject --> 
    </head> 

    <body ng-app="app"> 

    <div id="mainContainer"> 

     <div id="ideaDriveImgContainer" class="backgroundSize"> 
     <img id="ideaDriveImg" class="backgroundSize"> 
     </div> 

     <div ui-view></div> 

    </div> 

     <!-- bower:js --> 
     <script src="bower_components/angular/angular.js"></script> 
     <script src="bower_components/angular-route/angular-route.js"></script> 
     <script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script> 
     <script src="bower_components/angular-ui-bootstrap-bower/ui-bootstrap-tpls.js"></script> 
     <script src="bower_components/bootstrap/dist/js/bootstrap.js"></script> 
     <!-- endinject --> 
     <!-- inject:js --> 
     <script src="app/scripts/module/app.js"></script> 
     <script src="app/scripts/controllers/IdeaMgmtMainController.js"></script> 

     <!-- endinject --> 
    </body> 

</html>

ideaMgmt-landing.html上（HTML我的主頁）

<div id="signUpContainer" style="cursor: pointer;"> 
    <div id="signUpArea" class="text"> 
     <a ui-sref="signUp"><span>SignUp</span></a> //to trigger the signUp state 
    </div> 
</div>

signUpModal.html

<div id="close" class="ax_shape"> 
      <a ui-sref="home"> 
      <button type="button" class="close" aria-label="Close" data-dismiss="modal"> 
       <span aria-hidden="true">&times;</span> 
      </button></a> 

    </div>

個

app.js（路由配置）

(function(){ 
    'use strict'; 
    var App = angular.module('app', ['ui.router','ui.bootstrap']); 

    App.config(function($stateProvider, $urlRouterProvider) { 

     $stateProvider.state('home', { 
      url:'/home', 
      templateUrl:'app/views/ideaMgmt-landing.html' , 
      controller: 'IdeaMgmtMainController' 
     }), 
     $stateProvider.state('signUp', { 
      url: '/signUp', 
     // trigger the modal to open when this route is active 
      onEnter: ['$stateParams', '$state', '$modal', 
       function($stateParams, $state, $modal) { 
       // handle modal open 
       $modal.open({ 
        templateUrl: 'app/views/modalTemplates/signUpModal.html', 

        }); 
       }] 
     }); 

     $urlRouterProvider.otherwise('/home'); 
    }); 
} 
());

來源

2016-03-08 RVR

您在'index.html'中有一個未封閉的'

相關問題