1. AngularJS介绍
AngularJS是一个为动态WEB应用设计的结构框架。它能让你使用HTML作为模板语言,通过扩展HTML的语法,让你能更清楚、简洁地构建你的应用组件。它的创新点在于,利用 数据绑定 和 依赖注入,它使你不用再写大量的代码了。这些全都是通过浏览器端的Javascript实现,这也使得它能够完美地和任何服务器端技术结合。
2. 构建AngularJS项目
构建项目有三种:
- 手工项目: 自己建目录,下载类库,写html,js,css,自己实现引用关系
- angular-seed项目: 下载github的angular-seed,在别人的基础之上开发
- Yeoman项目:通过Yeoman下载一个标准Yeoman项目,已经内置了grunt及各种工具包
1). 手工项目
构建手工项目是我们平时用的最多的一种方式了,适用于小型或demo项目。我不在解释,参照angularjs一步一步操作就行了
2). angular-seed项目
一般把这个项目称为angular的“种子项目”,构建方法是去github下载项目源代码,基于已有项目结构再做开发。这种项目都融入了前人的经验,会以一种比较合理的结构,帮我们构建出项目的原型。适合于有一定规模项目开发,同时更适合geek的扩展。
3).下载AngularJs项目
github上有一个比较好的纯净AngularJs app的种子,可以去github下载,地址:
https://github.com/glitchtank/angular-seed-master。
4). AngularJs目录说明
## Directory Layout
app/ --> all of the files to be used in production
css/ --> css files
app.css --> default stylesheet
img/ --> image files
index.html --> app layout file (the main html template file of the app)
index-async.html --> just like index.html, but loads js files asynchronously
js/ --> javascript files
app.js --> application
controllers.js --> application controllers
directives.js --> application directives
filters.js --> custom angular filters
services.js --> custom angular services
lib/ --> angular and 3rd party javascript libraries
angular/
angular.js --> the latest angular js
angular.min.js --> the latest minified angular js
angular-*.js --> angular add-on modules
version.txt --> version number
partials/ --> angular view partials (partial html templates)
partial1.html
partial2.html
config/karma.conf.js --> config file for running unit tests with Karma
config/karma-e2e.conf.js --> config file for running e2e tests with Karma
scripts/ --> handy shell/js/ruby scripts
e2e-test.sh --> runs end-to-end tests with Karma (*nix)
e2e-test.bat --> runs end-to-end tests with Karma (windows)
test.bat --> autotests unit tests with Karma (windows)
test.sh --> autotests unit tests with Karma (*nix)
web-server.js --> simple development webserver based on node.js
test/ --> test source files and libraries
e2e/ -->
runner.html --> end-to-end test runner (open in your browser to run)
scenarios.js --> end-to-end specs
lib/
angular/ --> angular testing libraries
angular-mocks.js --> mocks that replace certain angular services in tests
angular-scenario.js --> angular's scenario (end-to-end) test runner library
version.txt --> version file
unit/ --> unit level specs/tests
controllersSpec.js --> specs for controllers
directivessSpec.js --> specs for directives
filtersSpec.js --> specs for filters
servicesSpec.js --> specs for services
相关推荐
AngularJS项目搭建技术入门,文档中教你用Grunt、Gulp搭建完整的前端运行框架,以及对于新手如何快速上手angularjs起到很大的帮助。
**AngularJS 项目详解** AngularJS,作为一款强大的前端JavaScript框架,由Google维护,主要用于构建单页应用程序(SPA)。这个“广告-AngularJS-项目”很可能是为了演示或者实践如何利用AngularJS来开发广告相关的...
本教程将引导你逐步入门AngularJS,通过创建一个简单的项目来理解其核心概念。在我们的项目中,我们将涵盖网络请求封装、模拟Android的toast效果以及前台数据MD5加密。 1. **AngularJS基本概念** - **模块(Module...
根据所提供的文件内容,我们可以总结出以下关于Ionic项目以及AngularJS的知识点: ### Ionic项目简介 Ionic是一个开源的前端框架,用于开发跨平台的移动应用。它主要利用Web技术(HTML5、CSS、JavaScript)以及...
"angularApp:AngularJS 项目的脚手架" 提供了一种快速启动 AngularJS 应用程序开发的方式,它预先配置了一系列工具,使得开发者能够更加高效地进行项目构建。 在描述中提到的 "安装" 部分,提到了几个关键的命令行...
在本文中,我们将深入探讨AngularJS分页的实现方法,这是一种强大的前端JavaScript框架,用于构建交互式的Web应用程序。...在实际项目中,应根据具体需求进行适当的定制和优化,确保分页功能既实用又高效。
"angular-base:新的AngularJS项目的脚手架项目" 这个标题表明我们正在讨论一个用于创建新AngularJS项目的初始模板或脚手架。"angular-base"可能是一个特定的项目或工具,它预先配置了必要的文件和结构,使得开发者...
用requirejs搭建angularjs项目,以及angularjs常用功能使用demo #注意 项目的资源并没有用bower管理,直接提交了 先手动搭建一个server,让项目可以正常访问 index.html是requirejs 搭建angularjs入口 其他html页面...
这将为您提供创建小型angularjs项目的基本结构。 它使用jquery,angularjs,angular-route和bootstrap。 安装 为了使用此仓库,请检查是否 节点和npm 凉亭 吉特 咕unt 已安装在您的系统上。 启动和运行的步骤- ...
**AngularJS 项目——flapperNews** AngularJS 是一个由 Google 主导开发的前端 JavaScript 框架,它主要用于构建动态、数据驱动的 Web 应用。在"flapperNews"这个项目中,我们将深入探讨如何利用 AngularJS 来创建...
AngularJS实战通过理论与实践相结合的方式,精选了92个简洁、实用的实例,用由浅入深、逐层推进的方式,详细地展示了Angular作为前端Web页面开发新利器的方方面面。通过本书的学习,读者不仅可以全面了解并掌握整个...
在AngularJS项目中,页面跳转是常见的操作,它涉及到应用程序的导航流程和用户体验。本文将详细介绍五种在AngularJS中实现页面跳转的方法,帮助开发者更好地理解和掌握这些技术。 1. **基于ui-router的页面跳转传参...
一个针对AngularJS项目HTML验证器。 尽管还有其他一些节点插件可以验证HTML文件,但是缺少一些重要的功能: 支持AngularJS属性和标签(来自AngularJS和自定义创建) 支持模板化/片段化HTML文件 能够同时验证文件...
Pawel是自由和开源软件的坚定支持者,他在AngularJS 社区非常活跃,为AngularJS项目贡献了大量的代码。他也对Angular UI (AngularJS的配套框架)有所贡献,并为AngularJS 提供了Twitter Bootstrap 相关的指令...
5. **项目模板**:提供了AngularJS项目的创建向导,可以快速搭建起一个标准的AngularJS应用结构。 6. **集成测试**:与 Karma 集成,支持单元测试和端到端测试,方便进行自动化测试。 7. **资源管理**:对...
SoftUni 中的 AngularJs 课程的 AngularJs 项目 您被指派设计和实施一个使用 HTML5 和 AngularJS 作为单页应用程序 (SPA) 发布在线广告的网站。 该应用程序管理按城镇和类别组织的用户及其广告。 匿名网站访问者...
本文将深入探讨如何利用Yeoman这一自动化工具来构建AngularJS项目,以提高开发效率。 首先,让我们了解什么是Yeoman。Yeoman是一个现代化的工作流工具,它可以帮助开发者快速搭建项目结构,自动配置各种构建工具,...
**AngularJS项目——软uni广告应用** AngularJS是一款由Google维护的前端JavaScript框架,用于构建单页应用程序(SPA,Single Page Applications)。这个“AngularJSproject”是一个基于AngularJS的实战项目,专注...
本开发实例“angularjs 开发实例”提供了一个实际的项目案例,帮助开发者深入理解AngularJS的核心概念和功能。 在下载并解压缩文件后,您会得到一个名为"angular-phonecat"的文件夹。这个文件夹包含了完整的...
要深入了解这个入门 Demo,建议访问项目笔记地址(),那里会有更详细的步骤和代码解释。同时,通过实践 AngularJS-demo 中的示例,你将更好地掌握 AngularJS 的基础,为进一步深入学习和应用打下坚实的基础。