博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Angular 入门学习
阅读量:4964 次
发布时间:2019-06-12

本文共 1204 字,大约阅读时间需要 4 分钟。

1、Hello World 入门

源代码

                            Hello {
{
'World'}}!
 中的 ng-app 表示告诉AngularJS处理整个HTML页面并引导引用。
 运行载入AngularJS的脚本(初次运行,有点慢)
Hello {
{
'World'}} 使用双大括号标记{ {}}的内容是问候语中绑定的表达式,这个表达式是一个简单的字符串‘World’。 2、AngularJS双向绑定数据 源代码
                            Your name:         

Hello {
{yourname || 'World'}}!

其中:

(1)、文本输入指令<input ng-model="yourname" />绑定到一个叫yourname的模型变量,placeholder默认值。

(2)、双大括号标记将yourname模型变量添加到问候语文本。

(3)、你不需要为该应用另外注册一个事件侦听器或添加事件处理程序!

运行程序,在文本框中输入字符将显示出来。

3、AngularJS应用的解析

本节描述AngularJS应用程序的三个组成部分,并解释它们如何映射到模型-视图-控制器设计模式:

模板(Templates)

模板是您用HTML和CSS编写的文件,展现应用的视图。 您可给HTML添加新的元素、属性标记,作为AngularJS编译器的指令。 AngularJS编译器是完全可扩展的,这意味着通过AngularJS您可以在HTML中构建您自己的HTML标记!

应用程序逻辑(Logic)和行为(Behavior)

应用程序逻辑和行为是您用JavaScript定义的控制器。AngularJS与标准AJAX应用程序不同,您不需要另外编写侦听器或DOM控制器,因为它们已经内置到AngularJS中了。这些功能使您的应用程序逻辑很容易编写、测试、维护和理解。

模型数据(Data)

模型是从AngularJS作用域对象的属性引申的。模型中的数据可能是Javascript对象、数组或基本类型,这都不重要,重要的是,他们都属于AngularJS作用域对象。

AngularJS通过作用域来保持数据模型与视图界面UI的双向同步。一旦模型状态发生改变,AngularJS会立即刷新反映在视图界面中,反之亦然。

此外,AngularJS还提供了一些非常有用的服务特性:

  1. 底层服务包括依赖注入,XHR、缓存、URL路由和浏览器抽象服务。
  2. 您还可以扩展和添加自己特定的应用服务。
  3. 这些服务可以让您非常方便的编写WEB应用。

 

 
 

转载于:https://www.cnblogs.com/xiadongqing/p/6101503.html

你可能感兴趣的文章
log4j详解(二)
查看>>
滚动条
查看>>
数据结构之---C语言实现图的邻接表存储表示
查看>>
自动提交Git branch代码评审到Review Board系统
查看>>
javaoop_pst和rst和cst
查看>>
【转载】自定义地图数据瓦片化请求的一种实现方案
查看>>
Spring之FactoryBean
查看>>
ORACLE常用数值函数、转换函数、字符串函数
查看>>
IAAS、SAAS 和 PAAS 的区别、理解
查看>>
Java RMI详解
查看>>
idea设置条件断点
查看>>
6.【应急响应】Linux入侵排查思路
查看>>
windows32位系统 安装MongoDB
查看>>
C#中的扩展类的理解
查看>>
TypeScript--函数
查看>>
【转】谷歌大数据的三篇论文
查看>>
第三章编程练习题3.1
查看>>
删除重复数据只保留一条
查看>>
排序之快速排序(上)
查看>>
计算机端口大全
查看>>