javascript - 如何在 Bootstrap 导航栏中放置按钮？

Question

我的 html 网站中有一个导航栏元素，我想知道如何向导航栏添加一个按钮。我想这样做是因为我想调用js函数来切换页面的内容，而不是让浏览器加载整个新页面。我尝试过添加一个按钮，但它的格式不正确。我只是希望它看起来像导航栏中的普通链接，但调用函数而不是链接。

<!--Nav bar source-->
<nav class="navbar navbar-default">
    <div class="container-fluid">
        <div class="navbar-header">
            <a class="navbar-brand" href="">Brand</a>
        </div>
        <div>
            <ul class="nav navbar-nav">
                <li><a>button needed here</a></li>
                <li><a>button needed here</a></li>
            </ul>
        </div>
    </div>
</nav>

<!--script.js source-->
var app = angular.module('app', []);
app.controller('appController', ['$scope', function($scope){
    $scope.page1 = true; //whether to show page1 or not
    $scope.page2 = false;
}]);

编辑: 它不一定是一个按钮，我只是希望找到解决这个问题的方法

Answer 1

我通过将“ng-click”指令添加到“a”元素来解决这个问题，该指令具有更改页面内容的功能。我还在 'a' 元素中添加了 'href="#"'，这样鼠标悬停时就会显示正确的光标。