这个angular的例子怎么用jquery实现

2025-02-24 07:53:02

推荐回答（3个）

回答1：

[html] view plain copy

{{name}}

学习angularJS一段时间了，也将angular成功的引入了两个项目，今天，我就将我使用angular这半年的经验，通过博客慢慢的记录下。

一、什么是angular?

AngularJS 重新定义了前端应用的开发方式。面对HTML和JavaScript之间的界线，它非但不畏缩不前，反而正面出击，提出了有效的解决方案。

很多前端应用的开发框架，比如Backbone、EmberJS等，都要求开发者继承此框架特有的一些JavaScript对象。这种方式有其长处，但它不必要地污染了开发者自己代码的对象空间，还要求开发者去了解内存里那些抽象对象。尽管如此我们还是接受了这种方式，因为网络最初的设计无法提供我们今天所需的交互性，于是我们需要框架，来帮我们填补JavaScript和HTML之间的鸿沟。

AngularJS 填上了这条鸿沟。

而且有了它，你不用再“直接”操控DOM，只要给你的DOM注上metadata（即AngularJS里的directive们），然后让AngularJS来帮你操纵DOM。

同时，AngularJS不依赖（也不妨碍）任何其他的框架。你甚至可以基于其它的框架来开发AngularJS应用。

它就这么好用。听着挺厉害？是挺厉害的。通过这个七步系列，我们会带着你开始用AngularJS写厉害的应用——不管你之前有没有接触过。跟着我们，我们会教你成为一个专家级的AngularJS开发者。

不过首先我们得搞清楚：什么时候该用AngularJS？

AngularJS是一个 MV* 框架，最适于开发客户端的单页面应用。它不是个功能库，而是用来开发动态网页的框架。它专注于扩展HTML的功能，提供动态数据绑定（data binding），而且它能跟其它框架（如jQuery）合作融洽。

如果你要开发的是单页应用，AngularJS就是你的上上之选。Gmail、Google Docs、Twitter和Facebook这样的应用，都很能发挥AngularJS的长处。但是像游戏开发之类对DOM进行大量操纵、又或者单纯需要极高运行速度的应用，就不是AngularJS的用武之地了。

以上来此互联网

二、搭建angular环境

执行

npm

npm install angular --save

bower

bower install angular --save

什么？不知道npm,bower是什么？看看我以前的一篇博客吧！

当然你直接下载也行

直接下载地址

然后

在你的html文件中引用

或者

三、我们开始编写一个简单的angularAPP吧

首先

新建一个html文件

index.html

在src目录下简历两个javascript文件 app.js controller.js

如图

在index引入

[html] view plain copy

打开app.js写入

[javascript] view plain copy

var app = angular.module('Hello', []); //新建一个app模块叫hello ,[]后面的数组为引入的其他模块名，我们没有其他模块，为空数组

打开controller.js写入

[javascript] view plain copy

app.controller('helloCtrl', function ($scope) {
$scope.name = "菲尔";
});

打开index.html 改变内容为

[html] view plain copy

{{name}}

然后用浏览器打开这个文件

{{name}}被解释成controller.js中$scope,name的值
尝试改变一下input中的值

你会发现

回答2：

可以试试使用keydown函数：
当按下按键时，改变文本域的颜色：
$("input").keydown(function(){
$("input").css("background-color","#FFFFCC");
});

同样也可以改变下方显示的标签值。

回答3：

这个效果用key-press 事件来实现