AngularJS

Question

我有一个 Angular 应用程序，在 main.js 文件中我定义了应用程序路由，但我有疑问，例如，我有一个 bootstrap 的手风琴菜单，当我点击下一步按钮时：

<a href="#MainMenu" data-toggle="collapse" data-parent="#MainMenu" class="dropdown-toggle"><img src="img/ico_menu_off.png" /></a>

由于angular的配置路由，属性href="#MainMenu"，它认为这是一个路由，我不想做任何事情。

这是js代码：

angularRoutingApp.config(function($routeProvider) {
    $routeProvider
        .when('/', {
            templateUrl : 'pages/home.html',
            controller  : 'mainController'
        })
        .when('/customerSearch', {
            templateUrl : 'pages/customer-search.html',
            controller  : 'customerSearchController'
        })      
        .otherwise({
            redirectTo: '/'
        });
});

如何解决这个问题？谢谢，（我是 Angular 的新人）

Answer 1

在您的情况下，您不应将 href 属性用于 select 手风琴，因为它会在您使用锚点的 href 时直接更改 URL。要解决问题，您应该使用 data-target 属性而不是 href

标记

<a data-target="#MainMenu" data-toggle="collapse" data-parent="#MainMenu" class="dropdown-toggle">
   <img src="img/ico_menu_off.png" />
</a>

Answer 2

您可以删除 href 并在单击时使用 JavaScript 打开它：

$("#MainMenuTrigger").click(function(){
     $('#MainMenu').modal();
});

http://getbootstrap.com/javascript/#js-programmatic-api

我建议你也看看Angular UI Bootstrap。

Answer 3

您可以从 URL 中删除散列。找到这个 URL 它会对你有所帮助 http://www.codeproject.com/Tips/1063634/Removing-the-sharp-Sign-from-AngularJS-URLs-with-I

AngularJS - Angular 路由应用程序

AngularJS - Angular Routing App

angular-ui

angularjs-routing

angular-ui-bootstrap