AngularJS 中括号的作用详解

 更新时间:2021年04月02日 10:21:14   作者:Java Pro  
这篇文章主要介绍了AngularJS 中括号的作用,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

1.括号的作用

1.1方括号 [ ]

属性名加上方括号后,右侧赋值为 表达式的值
如果属性没有方括号,右侧赋值为 字符串

<div class="red">red</div>  //这里类名为red
<div [class]="red">red</div> //这里类名为blue,就是说有方括号右侧为表达式
 
//组件中
red: string = "blue";

1.2 圆括号( )

圆括号用于事件绑定,就是触发元素上的事件,绑定的方法就会响应,如

<div (click)="go()">gogo</div>  //圆括号里面放事件
 
//组件类
go() {
 //表达式...
}

1.3 花括号 {{ }}

使用花括号 {{表达式}} 这种方法称之为插值,可以放在模板中

<div>{{good}}</div>  //<div>你好</div> 
 
//组件类
good: string = "你好";

1.4 字符串变量${ }

举例

tes: string = "World";
test: string = `Hello ${goo}`;  //test: string = "Hello World";

1.5 [()]

常用的来做双向绑定的操作

<input [(ngModel)]='test_input' /> // value= 'testNgClick'
 
//组件中 
test_input: any = 'testNgClick';

到此这篇关于AngularJS 中括号的作用的文章就介绍到这了,更多相关AngularJS括号的作用内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Angular4 中内置指令的基本用法

    Angular4 中内置指令的基本用法

    不得不说指令是ng最为强大的功能之一,好吧,也可以去掉之一,是最强大的功能。下面这篇文章主要给大家介绍了关于Angular4中内置指令的基本用法,文中通过示例代码介绍的非常详细,需要的朋友们下面来一起看看吧。
    2017-07-07
  • Angular-UI Bootstrap组件实现警报功能

    Angular-UI Bootstrap组件实现警报功能

    这篇文章主要介绍了Angular-UI Bootstrap组件实现警报功能,对Angular.js services的学习有所帮助,需要的朋友可以参考下
    2018-07-07
  • 使用AngularJS制作一个简单的RSS阅读器的教程

    使用AngularJS制作一个简单的RSS阅读器的教程

    这篇文章主要介绍了使用Angular.js制作一个简单的RSS阅读器的教程,AngularJS是一个非常有人气的JavaScript库,文中介绍的制作方法主要使用到了FreedReadR模版,需要的朋友可以参考下
    2015-06-06
  • 使用 Angular RouteReuseStrategy 缓存(路由)组件的实例代码

    使用 Angular RouteReuseStrategy 缓存(路由)组件的实例代码

    这篇文章主要介绍了使用 Angular RouteReuseStrategy 缓存(路由)组件的实例代码,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下
    2019-11-11
  • 利用angular自动编译andriod APK的绕坑经历分享

    利用angular自动编译andriod APK的绕坑经历分享

    这篇文章主要给大家介绍了关于如何利用angular自动编译andriod APK的绕坑经历,文中通过示例代码以及图文介绍的非常详细,对大家的学习或者使用angular具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
    2019-03-03
  • angularJS实现动态添加,删除div方法

    angularJS实现动态添加,删除div方法

    下面小编就为大家分享一篇angularJS实现动态添加,删除div方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-02-02
  • Angularjs 自定义服务的三种方式(推荐)

    Angularjs 自定义服务的三种方式(推荐)

    angularjs 中可通过三种($provider,$factory,$service)方式自定义服务。这篇文章主要介绍了Angularjs 自定义服务的三种方式,非常不错,需要的朋友可以参考下
    2016-08-08
  • AngularJs ng-repeat 嵌套如何获取外层$index

    AngularJs ng-repeat 嵌套如何获取外层$index

    这篇文章主要介绍了AngularJs ng-repeat 嵌套如何获取外层$index的相关资料,需要的朋友可以参考下
    2016-09-09
  • AngularJS实现给动态生成的元素绑定事件的方法

    AngularJS实现给动态生成的元素绑定事件的方法

    这篇文章主要介绍了AngularJS实现给动态生成的元素绑定事件的方法,结合实例形式分析了AngularJS动态生成元素与事件绑定相关操作技巧,需要的朋友可以参考下
    2016-12-12
  • Angular排序实例详解

    Angular排序实例详解

    本文通过实例给大家介绍了angular排序的相关知识,非常不错,具有参考借鉴价值,需要的朋友参考下吧
    2017-06-06

最新评论