UI Bootstrap 下拉菜单正在添加 HTML 我没写

Question

我无法理解为什么 UI Bootstrap 添加 HTML 我没有在下拉列表中写。

这里 JSFiddle 显示了这个问题。您应该在下拉列表中看到三个 <a> 标记，它们未写入 HTML.

HTML:

<div ng-app="app" ng-controller="ctrl">
    <div class="dropdown">
        <a id="new" class="actionButton dropdown-toggle">
            New<span class="right-caret"></span>
            <ul class="dropdown-menu drop-right">
                <li ng-repeat="action in newActions">
                    <a ng-click="action.run()">{{action .name}}</a>
                </li>
            </ul>
        </a>
    </div>
</div>

JS:

var app = angular.module("app", ["ui.bootstrap"]);

app.controller("ctrl", function($scope) {
    $scope.newActions = [{
            name: "File",
            run: createFile
        }, {
            name: "Folder",
            run: createFolder
    }];

    $scope.status = {
        isopen: false
    };

    $scope.toggleDropdown = function($event) {
        $event.preventDefault();
        $event.stopPropagation();
        $scope.status.isopen = !$scope.status.isopen;
    };

    function createFile() {
    }

    function createFolder() {
    }
});

我是不是做错了什么？

注意：我正在使用ui-bootstrap-tpls-0.11.0.min.js。

Answer 1

你确实做错了。您需要关闭第一个 a 标签：

<div ng-app="app" ng-controller="ctrl">
    <div class="dropdown">
        <a id="new" class="actionButton dropdown-toggle">
            New<span class="right-caret"></span>
        </a>
        <ul class="dropdown-menu drop-right">
             <li ng-repeat="action in newActions">
                 <a ng-click="action.run()">{{action .name}}</a>
             </li>
        </ul>
    </div>
</div>

Answer 2

一些HTML问题

<div ng-app="app" ng-controller="ctrl">
        <div class="dropdown">
            <a id="new" class="actionButton dropdown-toggle">
                New<span class="right-caret"></span>
             </a> // Issue here - Close the "a" tag here
                <ul class="dropdown-menu drop-right">
                    <li ng-repeat="action in newActions">
                        <a ng-click="action.run()">{{action .name}}</a>
                    </li>
                </ul>
        </div>
    </div>

UI Bootstrap 下拉菜单正在添加 HTML 我没写

UI Bootstrap dropdown is adding HTML I didn't write

angularjs

angular-ui-bootstrap