AngularJS(一)——初识AngularJS

一、AngularJS 是什么

        AngularJS是一个为动态WEB应用设计的结构框架。它能让你使用HTML作为模板语言,通过扩展HTML的语法,让你能更清楚、简洁地构建你的应用组件。它的创新点在于,利用数据绑定和依赖注入,它使你不用再写大量的代码了。这些全都是通过浏览器端的Javascript实现,这也使得它能够完美地和任何服务器端技术结合。

        AngularJS是为了克服HTML在构建应用上的不足而设计的。HTML是一门很好的为静态文本展示设计的声明式语言,但要构建WEB应用的话它就显得乏力了。所以AngularJS做了一些工作(你也可以觉得是小花招)来让浏览器做我想要的事。

        通常,我们是通过以下技术来解决静态网页技术在构建动态应用上的不足:

            类库-类库是一些函数的集合,它能帮助你写WEB应用。起主导作用的是你的代码,由你来决定何时使用类库。类库有: jQuery 等

            框架-框架是一种特殊的、已经实现了的WEB应用,你只需要对它填充具体的业务逻辑。这里框架是起主导作用的,由它来根据具体的应用逻辑来调用你的代码。框架有: knockout 、 sproutcore 等。

        AngularJS使用了不同的方法,它尝试去补足HTML本身在构建应用方面的缺陷。AngularJS通过使用我们称为标识符(directives)的结构,让浏览器能够识别新的语法。例如:

1、使用双大括号 {{}} 语法进行数据绑定;

2、使用DOM控制结构来实现迭代或者隐藏DOM片段;

3、支持表单和表单的验证;

4、能将逻辑代码关联到相关的DOM元素上;

5、能将HTML分组成可重用的组件。

 

二、AngularJS的可爱之处

        AngularJS通过为开发者呈现一个更高层次的抽象来简化应用的开发。如同其他的抽象技术一样,这也会损失一部分灵活性。换句话说,并不是所有的应用都适合用AngularJS来做。AngularJS主要考虑的是构建CRUD应用。幸运的是,至少90%的WEB应用都是CRUD应用。但是要了解什么适合用AngularJS构建,就得了解什么不适合用AngularJS构建。

        如游戏,图形界面编辑器,这种DOM操作很频繁也很复杂的应用,和CRUD应用就有很大的不同,它们不适合用AngularJS来构建。像这种情况用一些更轻量、简单的技术如 jQuery 可能会更好。

 

三、Hello World实例

HelloAngular_MVC.html

<span style="font-size:18px;"><!doctypehtml>
<htmlng-app>
    <head>
        <meta charset="utf-8">
    </head>
    <body>
        <divng-controller="HelloAngular">
            <p>{{greeting.text}},World</p>
        </div>
    </body>
    <scriptsrc="js/angular-1.3.0.js"></script>
    <scriptsrc="HelloAngular_MVC.js"></script>
</html></span>

HelloAngular_MVC.js

<span style="font-size:18px;">functionHelloAngular($scope) {
    $scope.greeting = {
        text: 'Hello'
    };
}</span>

效果图:


 

四、总结

     angularJS其实也不难,刚开始的看他们学视频,但是感觉效果不是很好,所以自己就找了一些书籍来学习,效果还不错。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 15
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 15
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值