博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Angular双向数据绑定
阅读量:5079 次
发布时间:2019-06-12

本文共 1474 字,大约阅读时间需要 4 分钟。

1. directives中的=、@、&

   = 双向数据绑定,一般传ngModel,指令中的属性值为对应的scope值

   @ string类型,html中字面量/直接量,可以是ngModel中对象里面的单个属性的名字, 单文本绑定, 这个属性的值必须是父级作用域中的

   & 传函数,一般在onChange上用,在父scope中执行函数

2. RestAngular

  如果Restangular接收的值不是实体,则this.customPOST info, 'info'

  若是实体,则this.all('list').getList(params)或者this.one('one', id).get()

3. ng-show/ng-hide 与 ng-if 的区别: ng-if 会移除dom,生成dom,而ng-show只是改变其display属性, 具体说它不是通过CSS显示或隐藏DOM节点,而是删除或者新增结点。当一个元素被ng-if从DOM中移除,同它关联的作用域也会被销毁。而且当它重新加入DOM中时,会通过原型继承从它的父作用域生成一个新的作用域。

          
        这段代码默认情况下clear按钮不显示;当在text中输入内容时,clear按钮会显示;点击clear按钮时,会清空text中的内容,同时隐藏clear按钮。 如果将ng-show改成ng-if,点击clear按钮的时候,不能清空text中的内容,也不能隐藏clear按钮。这是因为ng-if会新建或者销毁作用域。

4. ng-class="{样式1 : 条件1, 样式2: 条件2, 样式3: 条件, ...}"

5. ng-click="function"

6. ng-model 一般用于可输入的框上

    {

{data}}用于展示, ng-bind替换{
{}}可以解决花括号闪烁问题

7. {

{判断}} => {
{a? a: ''}}

8. ng-disabled

9. ng-repeat= "box in boxList track by $index"

10. ng-href="url"

11. 过滤器: {

{100000 | currency}} => 100,000.00; {
{100000 | number}} => 100,000; {
{1458913934000 | date: "yyyy-MM-dd"}}; {
{'hello' | translate}}

12. translate=model和字符串: translate="statistics_{

{a}}_child_total"; {
{'statistics_' + a + '_child_total' | translate}}

  coffee中filter加translate: $filter('translate')('fee_structure_free_first_year')

  {

{translate}}拼接: "child_count_tip": "共{
{total}}人","child_count_tip": "Total count: {
{total}}",  {
{'child_count_tip' | translate: {'total': child.totalItems} }}

转载于:https://www.cnblogs.com/floraCnblogs/p/angualr-summary.html

你可能感兴趣的文章
通过“四大行为”对WCF的扩展[原理篇]
查看>>
.NET Core采用的全新配置系统[9]: 为什么针对XML的支持不够好?如何改进?
查看>>
linux内核SPI总线驱动分析(一)(转)
查看>>
ASP.NET Core 认证与授权[5]:初识授权
查看>>
Introduction to 3D Game Programming with DirectX 12 学习笔记之 --- 第十四章:曲面细分阶段...
查看>>
在WPF控件上添加Windows窗口式调整大小行为
查看>>
asp.net core参数保护之自定义要保护的参数类型
查看>>
RabbitMQ 在 C# 中简单应用
查看>>
[UWP]针对UWP程序多语言支持的总结,含RTL
查看>>
Bind Enum to Combobox.SelectedIndex
查看>>
背水一战 Windows 10 (36) - 控件(弹出类): ToolTip, Popup, PopupMenu
查看>>
零元学Expression Blend 4 - Chapter 35 讨厌!!我不想一直重复设定!!『Template Binding』使用前後的差异...
查看>>
(转)ZXing生成二维码和带logo的二维码,模仿微信生成二维码效果
查看>>
方法模板ThinkPHP3.1.2项目技巧三部曲 一
查看>>
属性页面Flexbox布局的简单演示之二
查看>>
最全的node.js安装步骤
查看>>
开学第一课
查看>>
运用NPOI操作EXCEL
查看>>
10 个 Redis 建议/技巧
查看>>
170112
查看>>