酷酷的前端MVC框架AngularJS(二)HelloWorld
- - ITeye博客angularJS在github上面进行一个代码的托管. 地址：https://github.com/angular/angularjs.org . 注意：需要兼容IE8的同学请下载1.3之前的版本，在1.3之后已经放弃了IE8，估计是为了以后大版本升级做铺垫吧. 各个版本的下地址在这里https://github.com/angular/angular.js/releases.
酷酷的前端MVC框架AngularJS(二)HelloWorld
标签：
前端
mvc
框架
| 发表时间：2014-08-25 00:29 | 作者：
出处：http://www.iteye.com
angularJS在github上面进行一个代码的托管
地址：https://github.com/angular/angularjs.org
注意：需要兼容IE8的同学请下载1.3之前的版本，在1.3之后已经放弃了IE8，估计是为了以后大版本升级做铺垫吧。各个版本的下地址在这里https://github.com/angular/angular.js/releases
新建一个hello.html
<script src="/soa-rest/static/app-js/angular.js"></script> <script src="/soa-rest/hello.js"></script>
angular.js是 NG的核心文件必须导入 hello.js 是书写我们自己的js代码文件。
在hello.js中加入如下代码
var app = angular.module('helloModule',[])
.controller('helloController',['$scope',function($scope){
$scope.world = 'World !!';
}]);
第一行
var app = angular.module('helloModule',[])
告诉NG我要创建一个新的模块，第一个参数是模块的名字‘helloModule’，第二个参数是一个数组，传入所依赖的模块名称。这里我们只是一个简单的hello，不需要以来其他模块，所以传入一个空数组即可。
第二行
.controller('helloController',['$scope',function($scope){
$scope.world = 'World !!';
}]);
NG是支持链式编程的，可以直接点，也可以使用app.的方式，看自己习惯，我更习惯链式编程的方式。这里看到一个新的单词‘controller’，没有错这就是NG中mvc的控制器的创建方式，第一个参数是控制器的名称，第二个参数是一个数组。在数组中第一二个参数是‘$scope’，scope的意思是域，同样在NG中他同样也是作用域的概念，这是一盒NG内置的对象，也可以理解为当前控制器作用域，NG中使用它来进行双向数据绑定，方法绑定等等。第二个参数是匿名函数，NG在执行的时候看到我们声明在匿名函数之前的‘$scope’便会把$scope注入给我们，我定义一个参数接受即可，如果没有找到我们所需要的便会抛出Error（是不是和spring的注入一样呢？思想是一样呀,嘿嘿！）。在匿名方法内部声明一个局部变量为world，并且赋值。这样子控制器就算写好了。
在hello.html页面中编写
<body ng-app="helloModule">
<div ng-controller="helloController">
hello <span ng-bind="world"></span>
<br>
hello <span>{{world}}</span>
</div>
</body>
第一行中的body中有一个属性为ng-app，意思为程序的入口，等同于java中的main方法。一个应用一般存在一个入口即可。ng-app的值其实就算我们刚刚声明的模块的名称。接下来的第二行一个DIV 中有一个属性 ng-controller 看单词意思就知道是ng的控制器了，value是刚刚创建的控制器的名称即可。在NG中有两种获取值得方式 ，第一种方式就算使用{{}}两对大括号的方式，这种方式是存在一定的问题的。在刷新速度过快活着网络卡顿的时候，会将{{key}}这种代码级别的展示给用户。第二章方式很好的解决了这一问题，使用NG提供的属性ng-bind 即可，简单把！以上步骤完成之后刷新hello.html 。
hello World !! hello World !!
两个hello World就打印在页面上了。
已有 0 人发表留言，猛击->> 这里<<-参与讨论
ITeye推荐
相关 [前端 mvc 框架] 推荐：
PHP的MVC开发框架 EaglePHP
- We_Get - 开源中国社区最新软件EaglePHP是一个简单、开源、高效、易扩展、面向对象的PHP MVC开发框架，借鉴国外优秀框架的设计思路，分层的设计思想使独立开发成为可能，建立模型推动代码的重用. 写此框架的用意是与大家共同学习和交流. 框架特点： 1、数据库表曾、删、改、查，自动生成，支持二次开发. 2、支持session在Memcahe、database、file中的无缝切换.
12款优秀JavaScript MVC框架评估
- - Web App Trend导读：在最近的几个月中，作者一直在寻求哪种MVC框架最为完美：将目前能获取到的所有框架都粗略地试了试，然后在文章中列出了每一种框架的情况概要，在文末分享了作者经过对比之后最终的推荐产品. 首先要特别说明一下，以下四个feature作者认为是十分重要的：. UI Bindings：[UI绑定]作者想说的不仅仅是模板，而是想谈一种在底层模型出现变化时，视图层能够自动相应地更新的陈述性方法.
MVC框架的映射和解耦
- - 博客 - 伯乐在线最近在写一个业务上用到的框架，回想起接触过的一些MVC框架，尤其是主要贡献在后端表现层上的那些，它们之间有太多的相似，在不断解耦的过程中，层数和模块数也越来越多，需要不断引入层与层之间的映射逻辑将不同层次之间关联起来，我们不妨来查看一下这个过程，能否寻找一些MVC框架的共性和启示. MVC 1到MVC 2模型的进化.
[Ext JS 4] MVC 应用程序框架
- - CSDN博客Web前端推荐文章大型客户端应用程序总是很难编写，很难组织和很难维护. 随着功能的增加和更多的开发人员加入项目，对项目的控制也越来越困难了. Ext JS 4 提供了一个新的应用程序框架帮助组织代码. 模型 - 一组栏位和数据的集合. Model （在Ext JS 3中使用Record class）. 视图 - 组件类型, grids,trees 和 panels 都是属于试图.
JavaScript 客户端 MVC 框架调查
- - 博客 - 伯乐在线来源： IBM DeveloperWorks. 15 年前，许多人都使用 Perl 和 ColdFusion 之类的工具构建网站. 我们经常编写可以在页面顶部查询数据库的脚本，对数据应用必要的转换，以及在同一个脚本底部显示数据. 这类架构适合于向网站添加简单的 “Contact us” 表单. 然而，随着应用程序变得更加复杂，这种方法无法进行相应的扩展来处理更大的复杂问题.
【转载】12种JavaScript MVC框架之比较
- - HTML5研究小组侯伯薇 发布于 2012年5月29日. Hempton是西雅图的一位黑客和设计师，他花费了几个月的时间研究和比较了12种流行的JavaScript MVC框架，并 在博客中总结了每种框架的优缺点，最终的结果是， Ember.js胜出. 此次比较针对的特性标准有四种，分别是：. UI绑定（UI Bindings）.
Node.js简单介绍并实现一个简单的Web MVC框架
- BeerBubble - CNode社区Node让你可以用javascript编写服务器端程序，让javascript脱离web浏览器的限制，像C#、JAVA、Python等语言一样在服务器端运行，这也让一些熟悉Javascript的前端开发人员进军到服务器端开发提供了一个便利的途径. Node是基于Google的V8引擎封装的，并提供了一些编写服务器程序的常用接口，例如文件流的处理.
《新版阿尔法城背后的前端MVC实践》的幻灯片和⋯⋯这次没剧本⋯⋯
- blankyao - YY in Limbo 混沌海狂想拖到最后一天才开始准备，所以没时间写剧本照着念了T___T. 幻灯片上的吐槽跟实际的讲话其实是属于两个平行世界：. 新版阿尔法城背后的前端MVC实践
View more presentations from Dexter Yy.
MVC演化史
- huige - 火丁笔记Martin Fowler在他所写的《企业应用架构模式》一书中感慨道：MVC已经成为我们最常误用的模式. 人们之所以常常误用MVC，很大程度上是因为混淆了不同的MVC变体. 大概上世纪七十年代，Xerox PARC的Trygve提出了MVC的概念，并应用在Smalltalk系统中，为了和其它类型的MVC加以区分，历史上习惯的称之为Classic MVC.