angularjs：ng單擊<a>不起作用，在</a>

Question

這是Javascript

    function gotoUrl($scope, $location, $http, $window) {
      $scope.setRoute = function (route) {
        $location.path(route);
    };

我的代碼是

      <ul class="nav navbar-nav navbar">
            <li><a href="#" data-ng-click="setRoute('summary')"><span
                    class="icon-bar-chart"></span> Summary</a></li>
            <li><a href="#
            " data-ng-click="setRoute('transactions')"><span
                    class="icon-reorder"></span>
                Transactions</a></li>
            <li><a href="#" data-ng-click="setRoute('budgets')"><span
                    class="icon-calendar"></span>
                Budgets</a></li>
        </ul>

路由配置為

app.config(function ($routeProvider) {
    $routeProvider
        .when('/summary', {templateUrl: '../static/partials/summary.html', controller: 'SummaryController'})
        .when('/transactions', { templateUrl: '../static/partials/listTransaction.html', controller: 'TransactionsManagerController'})
        .when('/profile', {templateUrl: '../static/partials/profile.html', controller: 'ProfileController'})
        .when('/new', {templateUrl: '../static/partials/addTransaction.html', controller: 'TransactionAddController'})
        .when('/budgets', {templateUrl: '../static/partials/budgets.html'})
        .otherwise({redirectTo: '/summary'});
});

當我單擊“ Transactions ，它將帶我到“ Summary

當我將代碼從<a>更改為<button> ，它起作用了，我在這里做錯了什么？

Answer 1

http://docs.angularjs.org/api/ng.directive:a

修改html A標記的默認行為，以便在href屬性為空時阻止默認操作。

Answer 2

嘗試設置href=""而不是href="#" 。 如果您使用的是hashbang模式路由，則后者會導致整頁重新加載，您的情況似乎也是如此。 您單擊的任何帶有href="#"鏈接都將導致您的應用程序完全重新加載頁面並加載默認路由-在您的情況下為Summary 。

Answer 3

您可以擺脫gotoUrl函數並將DOM修改為

<a href="#/transactions"><span></span>Transactions</a>

AngularJS將負責其余的工作。

Answer 4

更改此代碼段

<li><a href="#
        " data-ng-click="setRoute('transactions')"><span
                class="icon-reorder"></span>
            Transactions</a></li>

至

<li><a href="/transactions"><span
                class="icon-reorder"></span>
            Transactions</a></li>