<!DOCTYPE html>
<html lang="en" ng-app="apps">
<head>
<meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" type="text/css" href="css/bootstrap.css" />
<script src="js/angular.js"></script>
<script src="js/script.js"></script>
</head>
<body ng-controller="controller">
<nav class="navbar navbar-default">
<div class="container-fluid">
<a class="navbar-brand" href="https://sourcecodester.com">Sourcecodester</a>
</div>
</nav>
<div class="col-md-3"></div>
<div class="col-md-6 well">
<h3 class="text-primary">JavaScript - Simple Anchor Scroll Using AngularJs</h3>
<hr style="border-top:1px dotted;"/>
<center><button class="btn btn-success" id="top" ng-click="scrollTo('bottom')"><span class="glyphicon glyphicon-arrow-down"></span> Go to Bottom</button></center>
<br /><br />
<div>
<h1>What Is AngularJS?</h1>
<p>AngularJS is a structural framework for dynamic web apps. It lets you use HTML as your template language and lets you extend HTML's syntax to express your application's components clearly and succinctly. AngularJS's data binding and dependency injection eliminate much of the code you would otherwise have to write. And it all happens within the browser, making it an ideal partner with any server technology.</p>
<p>AngularJS is what HTML would have been, had it been designed for applications. HTML is a great declarative language for static documents. It does not contain much in the way of creating applications, and as a result building web applications is an exercise in what do I have to do to trick the browser into doing what I want?</p>
<p>The impedance mismatch between dynamic applications and static documents is often solved with:</p>
<ul>
<li><strong>a library</strong> - a collection of functions which are useful when writing web apps. Your code is in charge and it calls into the library when it sees fit. E.g., jQuery.</li>
<li><strong>frameworks</strong> - a particular implementation of a web application, where your code fills in the details. The framework is in charge and it calls into your code when it needs something app specific. E.g., durandal, ember, etc.</li>
</ul>
<h1>A complete client-side solution</h1>
<p>AngularJS is not a single piece in the overall puzzle of building the client-side of a web application. It handles all of the DOM and AJAX glue code you once wrote by hand and puts it in a well-defined structure. This makes AngularJS opinionated about how a CRUD (Create, Read, Update, Delete) application should be built. But while it is opinionated, it also tries to make sure that its opinion is just a starting point you can easily change. AngularJS comes with the following out-of-the-box:</p>
<ul>
<li>Everything you need to build a CRUD app in a cohesive set: Data-binding, basic templating directives, form validation, routing, deep-linking, reusable components and dependency injection.</li>
<li>Testability story: Unit-testing, end-to-end testing, mocks and test harnesses.</li>
<li>Seed application with directory layout and test scripts as a starting point.</li>
</ul>
</div>
<br />
<center><button class="btn btn-success" id="bottom" ng-click="scrollTo('top')"><span class="glyphicon glyphicon-arrow-up"></span> Go To Top</button></center>
</div>
</body>
</html>
JavaScript - Simple Anchor Scroll Using AngularJS.zip
需积分: 5 118 浏览量
2023-11-08
19:45:54
上传
评论
收藏 662KB ZIP 举报
JavaScript - Simple Anchor Scroll Using AngularJS.zip （16个子文件） 
JavaScript - Simple Anchor Scroll Using AngularJS js 
angular.js 1.3MB script.js 245B css bootstrap-theme.min.css.map 25KB bootstrap.min.css 118KB bootstrap-theme.css.map 47KB bootstrap-theme.css 26KB bootstrap.css.map 380KB bootstrap.css 143KB bootstrap-theme.min.css 23KB bootstrap.min.css.map 529KB
index.html 3KB fonts 
glyphicons-halflings-regular.svg 106KB glyphicons-halflings-regular.ttf 44KB glyphicons-halflings-regular.woff 23KB glyphicons-halflings-regular.eot 20KB glyphicons-halflings-regular.woff2 18KB资源评论
