angular / angular.js 修改

HTML的Web框架 AngularJS  JavaScript 前端框架 修改

代码最近更新:主要开发语言:JavaScript

项目介绍 README

点击右侧README查看项目详情介绍

angular.js

Angular JS (Angular.JS) 是一组用来开发Web页面的框架、模板以及数据绑定和丰富UI组件。它支持整个开发进程,提供web应用的架构,无需进行手工DOM操作。 AngularJS很小,只有60K,兼容主流浏览器,与 jQuery 配合良好。

数据绑定可能是AngularJS最酷最实用的特性。它能够帮助你避免书写大量的初始代码从而节约开发时间。一个典型的web应用可能包含了80%的代码用来处理,查询和监听DOM。数据绑定使得代码更少,你可以专注于你的应用。

传统来说,当model变化了。 开发人员需要手动处理DOM元素并且将属性反映到这些变化中。这个一个双向的过程。一方面,model变化驱动了DOM中元素变化,另一方面,DOM元素的变化也会影响到Model。这个在用户互动中更加复杂,因为开发人员需要处理和解析这些互动,然后融合到一个model中,并且更新View。这是一个手动的复杂过程,当一个应用非常庞大的时候,将会是一件非常费劲的事情。

特性二:模板

在AngularJS中,一个模板就是一个HTML文件。但是HTML的内容扩展了,包含了很多帮助你映射model到view的内容。

HTML模板将会被浏览器解析到DOM中。DOM然后成为AngularJS编译器的输入。AngularJS将会遍历DOM模板来生成一些指导,即,directive(指令)。所有的指令都负责针对view来设置数据绑定。

我们要理解AuguarJS并不把模板当做String来操作。输入AngularJS的是DOM而非string。数据绑定是DOM变化,不是字符串的连接或者innerHTML变化。使用DOM作为输入,而不是字符串,是AngularJS区别于其它的框架的最大原因。使用DOM允许你扩展指令词汇并且可以创建你自己的指令,甚至开发可重用的组件

特性三:MVC

针对客户端应用开发AngularJS吸收了传统的MVC基本原则。MVC或者Model-View-Controll设计模式针对不同的人可能意味不同的东西。AngularJS并不执行传统意义上的MVC,更接近于MVVM(Model-View-ViewModel)。

特性四:依赖注入(Dependency Injection,即DI)

AngularJS拥有内建的依赖注入子系统,可以帮助开发人员更容易的开发,理解和测试应用。

DI允许你请求你的依赖,而不是自己找寻它们。比如,我们需要一个东西,DI负责找创建并且提供给我们。

特性五:Directives(指令)

指令是我个人最喜欢的特性。你是不是也希望浏览器可以做点儿有意思的事情?那么AngularJS可以做到。 指令可以用来创建自定义的标签。它们可以用来装饰元素或者操作DOM属性。


以下内容来自angular.jsREADME.md文件

AngularJS Build Status

AngularJS lets you write client-side web applications as if you had a smarter browser. It lets you use good old HTML (or HAML, Jade/Pug and friends!) as your template language and lets you extend HTML’s syntax to express your application’s components clearly and succinctly. It automatically synchronizes data from your UI (view) with your JavaScript objects (model) through 2-way data binding. To help you structure your application better and make it easy to test, AngularJS teaches the browser how to do dependency injection and inversion of control.

It also helps with server-side communication, taming async callbacks with promises and deferred objects, and it makes client-side navigation and deep linking with hashbang urls or HTML5 pushState a piece of cake. Best of all? It makes development fun!

  • Web site: https://angularjs.org
  • Tutorial: https://docs.angularjs.org/tutorial
  • API Docs: https://docs.angularjs.org/api
  • Developer Guide: https://docs.angularjs.org/guide
  • Contribution guidelines: CONTRIBUTING.md
  • Dashboard: https://dashboard.angularjs.org
Looking for the new Angular? Go here: https://github.com/angular/angular

Building AngularJS

Once you have set up your environment, just run:

grunt package

Running tests

To execute all unit tests, use:

grunt test:unit

To execute end-to-end (e2e) tests, use:

grunt package
grunt test:e2e

To learn more about the grunt tasks, run grunt --help

Contribute & Develop

We've set up a separate document for our contribution guidelines.

Analytics

What to use AngularJS for and when to use it

AngularJS is the next generation framework where each component is designed to work with every other component in an interconnected way like a well-oiled machine. AngularJS is JavaScript MVC made easy and done right. (Well it is not really MVC, read on, to understand what this means.)

MVC, no, MV* done the right way!

MVC, short for Model-View-Controller, is a design pattern, i.e. how the code should be organized and how the different parts of an application separated for proper readability and debugging. Model is the data and the database. View is the user interface and what the user sees. Controller is the main link between Model and View. These are the three pillars of major programming frameworks present on the market today. On the other hand AngularJS works on MV*, short for Model-View-Whatever. The Whatever is AngularJS's way of telling that you may create any kind of linking between the Model and the View here.

Unlike other frameworks in any programming language, where MVC, the three separate components, each one has to be written and then connected by the programmer, AngularJS helps the programmer by asking him/her to just create these and everything else will be taken care of by AngularJS.

Interconnection with HTML at the root level

AngularJS uses HTML to define the user's interface. AngularJS also enables the programmer to write new HTML tags (AngularJS Directives) and increase the readability and understandability of the HTML code. Directives are AngularJS’s way of bringing additional functionality to HTML. Directives achieve this by enabling us to invent our own HTML elements. This also helps in making the code DRY (Don't Repeat Yourself), which means once created, a new directive can be used anywhere within the application.

HTML is also used to determine the wiring of the app. Special attributes in the HTML determine where to load the app, which components or controllers to use for each element, etc. We specify "what" gets loaded, but not "how". This declarative approach greatly simplifies app development in a sort of WYSIWYG way. Rather than spending time on how the program flows and orchestrating the various moving parts, we simply define what we want and AngularJS will take care of the dependencies.

Data Handling made simple

Data and Data Models in AngularJS are plain JavaScript objects and one can add and change properties directly on it and loop over objects and arrays at will.

Two-way Data Binding

One of AngularJS's strongest features. Two-way Data Binding means that if something changes in the Model, the change gets reflected in the View instantaneously, and the same happens the other way around. This is also referred to as Reactive Programming, i.e. suppose a = b + c is being programmed and after this, if the value of b and/or c is changed then the value of a will be automatically updated to reflect the change. AngularJS uses its "scopes" as a glue between the Model and View and makes these updates in one available for the other.

Less Written Code and Easily Maintainable Code

Everything in AngularJS is created to enable the programmer to end up writing less code that is easily maintainable and readable by any other new person on the team. Believe it or not, one can write a complete working two-way data binded application in less than 10 lines of code. Try and see for yourself!

Testing Ready

AngularJS has Dependency Injection, i.e. it takes care of providing all the necessary dependencies to its controllers and services whenever required. This helps in making the AngularJS code ready for unit testing by making use of mock dependencies created and injected. This makes AngularJS more modular and easily testable thus in turn helping a team create more robust applications.

angular.js 下的帖子

AngularJS 在实际应用中的优点和缺点 0

xia634015966 发表于 6个月前 (11-01)

查看更多帖子 ... 我要发帖