AngularJS:点击"一个好习惯"吗?为什么AngularJS中没有ng- {event}?

Pip*_*ipo 58 dom-events angularjs

我刚刚开始学习AngularJS并且与AngularJS的一些概念斗争.如果有人可以向我解释一些问题,那就太好了......

  1. 据我所知,这ng-click在技​​术上并不相同onclick(见这里),但两者都放在标记中.我认为这将是一个"不好的做法"?如果大多数人说这是"坏",为什么这是AngularJS的核心概念之一?我认为最好从JavaScript中选择DOM元素,而不是在标记中放置逻辑.

  2. 如果ng-click是对AngularJS中的点击事件做出反应的正确方法,我应该如何处理其他DOM事件?我看到有其他几个指令ng-mouseover,但并非所有DOM事件都有一个AngularJS等价物.我如何处理AngularJS中的'drop'事件(因此采用AngularJS方式 - 不是正常方式)?要明确:我想将文件拖到我的webapp中.

非常感谢Pipo

Mar*_*cok 54

如果大多数人说这是"坏",为什么这是AngularJS的核心概念之一?

那些真正喜欢Unobtrusive JavaScript的人可能会说它很糟糕.Angularians(以及那些具有弹性背景的人)在更具声明性的方法中看到了价值.

"Angular是围绕以下信念构建的:当构建UI并将软件组件连接在一起时,声明性代码优于命令式......通过声明性地描述UI应如何随应用程序状态的变化而变化,您可以从低级DOM操作中解脱出来任务. - 概述文档

另请参阅Bootstrap,Angular.js和Ember.js中使用的数据属性选项是否与Unobtrusive Javascript原则冲突?

我应该怎么做其他DOM事件?

编写自己的指令来监听它们(或找到其他人已经写过的指令).Angular使您能够扩展浏览器的功能 - 通过编写自己的指令.

更新:在下面的评论中,Tim Stewart提到了AngularUI的ui事件,它允许您将回调绑定到Angular本身不支持的任何事件.

  • @Pipo - 有人已经为你做了 - 检查AngularUI中的ui-event,让你绑定到任何DOM事件:http://angular-ui.github.com/#directives-event (8认同)
  • @Pipo,是的,Angular没有包装相同的"事件能力".但是,在Angular应用程序中,我们通常会观察$ scope/models/data的更改,这会触发回调函数,而不是监视触发回调函数的事件.所以我想可以说Angular具有"模型能力",因此无需"事件能力"_.Angular:更改数据模型并让视图(包含指令的声明性HTML)"自动"更新/更改(DOM).jQuery:注册事件,触发(命令性)代码,用于更新/更改DOM. (3认同)
  • +1; 这一切都与上下文有关.在Angular应用程序中,视图声明用户如何与应用程序交互,并且由于视图是HTML,因此这就是"ng-click"等.走.在其他应用程序和框架中,情况并非如此. (2认同)
  • @Pipo,我不认为它与编写自己的jQuery插件在jQuery领域完成你想要的任何不同.我不太了解缩放部分......我们编写的指令与Angular人写的内置指令没有什么不同.在[这个10分钟的视频](https://plus.google.com/+AngularJS/posts/6DjeAMwXco7)中,Igor甚至说如果你愿意,你可以重写所有内置指令.对于我们可以编写的内置指令vs指令,没有固有的速度或扩展优势.例如,相同的Angular编译器解析两者. (2认同)
  • @MarkRajcok:我认为这有点不同.当我使用jQuery时,我可以获得所有"jQuery power"并且可以使用所有"DOM事件"和".on({eventName},callback".我没有必要开发一个jQuery插件来使用所有DOM事件并获得jQuery的优点.在其他方面,AngularJS中没有"ng- {eventName} ='回调'"(至少不适用于所有事件).因此,如果我不写,我不会从AngularJS中获益自定义指令. (2认同)

Cra*_*aig 5

从本质上讲,Angular需要标记中的元素才能正常运行.此外,这些元素在每次更改时都必须"编译",大多数情况下.所以,无论JavaScript如何,它已经有点"突兀"了.你不能简单地替换标记,并像你可以像jQuery一样自动绑定一切.

严格来说,不引人注目的JavaScript:1.分离结构和行为,以使您的代码更清晰,脚本维护更容易2.抢占浏览器不兼容性3.使用干净的语义HTML层(维基百科)

那肯定不是Angular.为了实现对所有内容的双向绑定,他们选择在DOM中创建自定义绑定点,而不是像jQuery那样使用类名或ID.(有点非标准的方法,但它显然有效.)

但想到它的真正方法是:基本上你的标记的每个受控部分都不再是直接的HTML了.它现在更像是一个模板,因此需要与准备渲染的引擎进行交互.因此,传统的不引人注意的规则并不真正适用......(FWIW,我是jQuery.on()函数的忠实粉丝/用户,在元素添加到页面时自动将元素绑定到事件.非常干净和灵活,恕我直言,我希望在Angular中有一个类似的机制.我喜欢在页面上的多个位置添加一个类,自动调用相同的事件处理程序.有一个地方去更改代码是一个好事.但是我离题了...)

对我来说,更大的问题是渐进式设计.网页是否在没有启用JavaScript的情况下工作?有人真的关心这个吗?嗯...