Bootstrap和AngularJS简单代码

Bootstrap and AngularJS Simple Code

本文关键字：代码 简单 AngularJS Bootstrap      更新时间：2023-09-26

嗨，伙计们，我有一个使用Bootstrap和AngularJS的简单代码，我似乎无法处理。点击按钮后，它只会显示一个警报。这是代码：

var myapp = angular.module('myapp',['ui.bootstrap']);
myapp.controller('mainCtrl', ['$scope',mainCtrl]);
function mainCtrl($scope) {
    $scope.testing = function() {
        alert("Button Is Pressed");
    }
}
<!DOCTYPE html>
<html lang="en-US" data-ng-app="myapp">
<head>
<title>Sample Angular JS</title>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet">
<script type='text/javascript' src='https://github.com/angular-ui/bootstrap/blob/gh-pages/ui-bootstrap-0.11.2.min.js'></script>
<script type='text/javascript' src='https://code.angularjs.org/1.3.0-rc.1/angular.min.js'></script>
<script type='text/javascript' src='myapp.js'></script>
</head>
<body data-ng-controller="mainCtrl">
<div class="container">
    <button class="navbar-btn btn-danger btn pull-right" data-ng-click="testing()">Test</button>
</div>
</body>
</html>

我不知道为什么按钮不起作用，可能是因为我使用的库吗？请告知我是AngularJS框架的新手。非常感谢。

ui引导程序需要引导程序，而引导程序需要jQuery。。。你会得到一个依赖性错误，导致什么都不起作用。。。

您应该在加载需要角度对象的ui-bootstrap之前加载angular.js。您可能还需要按照@sahbeewah的建议添加jQuery引用。

相关文章：