详解Angular的双向数据绑定(MV-VM)

angular的核心MVVM,下面来看看MV(数据到视图)。

rush:js;">
{{name}}

执行上面代码,我们使用setTimeout延迟两秒去更新数据(M),我们的视图(V)并没有发生改变。

其实数据确实发生改变了,但是我们的视图(V)并没有及时刷新,原因是原生的setTimeout不具备刷新的功能

angular为我们提供了setTimeout的服务,$timeout,需要在Aaa中引入该服务 !

rush:js;">
{{name}}

我们在ID为Aaa的元素绑定了一个点击事件,当发生点击的时候将name值改为Hi,

当然,也可以传递一个函数,来实现更多的功能

rush:js;">
{{name}}

看到了click,相信你也知道如何使用鼠标移入和移出的这些常用的事件了。

看最后一个例子,V(视图)到M(数据)的过程。

rush:js;">
{{name}}

我们在input标签上绑定了一个ng-model,这个就是绑定的数据,会认填充到input的value上,当我们的input值发生改变的时候,对应在$scope中的数据也会发生改变,从而影响到视图中的p标签的值也会发生改变。

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持编程之家!

相关文章

前言 做过web项目开发的人对layer弹层组件肯定不陌生,作为l...
前言 前端表单校验是过滤无效数据、假数据、有毒数据的第一步...
前言 图片上传是web项目常见的需求,我基于之前的博客的代码...
前言 导出Excel文件这个功能,通常都是在后端实现返回前端一...
前言 众所周知,js是单线程的,从上往下,从左往右依次执行,...
前言 项目开发中,我们可能会碰到这样的需求:select标签,禁...