没有jQuery的AngularJS DOM /文档选择

AngularJS没有内置的DOM选择引擎，但提供了处理jQuery为典型应用程序提供的一部分功能的实用方法。没有jQuery的AngularJS DOM /文档选择

但是，DOM选择仍然是国王，我试图将jQuery保留在我的应用程序中，仅用于DOM选择的唯一目的。

Angular以可注射的形式提供$ document服务。我觉得这很麻烦。例如，使用$文件，您将需要$文件注入到所需的所有指令，并呼吁querySelectorAll，然后将其与角范围达到原生DOM选择：

angular.element($document[0].querySelectorAll('#element'))

这是愚蠢的。

在有临时我提供我自己一个全球性的帮手，但它不使用角的包裹$文件...

// Create a shortcut to querySelectorAll 
    window.query = function(selector) { 
    return document.querySelectorAll(selector) 
    } 

    // For use inside a directive like so... 
    angular.element(query('#element'))

AngularJS是过敏全局和包装保护和可测试性全局。有没有一种干净的方式，我可以利用querySelectAll而不传递$文档到每个指令？我可以用jQuery的相同方式扩展angular.element，但利用querySelectorAll吗？

编辑：

我也想说明原来的JQLite库支持基本的选择https://code.google.com/p/jqlite/wiki/UsingJQLite#Supported_Selectors。

的AngularJS但是执行不支持选择，也似乎提这个功能遗漏 - http://docs.angularjs.org/api/angular.element

相反AngularJS做：

throw Error('selectors not implemented');

^当传递给angular.element该项目是一个字符串，它不不以'<'开头。

它会是不错的，如果那是：

return document.querySelectorAll(element)

...一些基本的错误预防逻辑。

来源

2013-03-22 BradGreens

你有没有想过使用像[Sizzle]（http://sizzlejs.com/）而不是完整的jQuery？（jQuery在内部运行） – 2013-03-22 18:00:12

我有，并且它可能是直到Angular采用选择模式之前的方式。你会看到我已经更新了帖子，表明我希望它只是在异常点返回一个document.querySelectorAll尝试。我的意思是，为什么不呢？这里没有增加膨胀。 – BradGreens 2013-03-22 18:17:25

我还应该注意到，在这些情况下，当Angular团队推荐使用document.querySelectorAll时，他们从他们在这里提倡的包装全局模式中脱身 - http://docs.angularjs.org/api/ng.$window 。 – BradGreens 2013-03-22 18:19:55

$document是一个包装，是真的。也许其中一位Angular作者可以证实这一点，但我认为这并不意味着被注入指令。 $window也不是。它仅适用于您需要在Controller或Service中处理$window或$document的罕见情况和案例。

当你在一个指令中，假定有DOM。因此，如果您愿意，可以直接使用document或window。

角度设计的方式，你不需要复杂的选择器。如果你正在做一个复杂的选择（即使在指令内部），可能会有一个更简单的方法来完成它。请注意，该指令可让您直接访问它所连接的元素。现在你应该主要关注元素周围的元素，也许元素就像兄弟姐妹或直接的孩子。如果你正在寻找其他地方的节点，那么这就是“气味”的第一个标志。

如果您可以让我们知道您试图达到的目标，那么有人可能会建议您一个很好地解决问题的解决方案。

来源

2013-03-22 18:49:37 ganaraj

有趣的点我发现的最常见的情况是注入元素s如样式表从标签从各种指令。我发现我还有其他一些可以使用ng-class指令等进一步细化的例子。也许我一直在想如何在Angular中使用$ document/$ window。当然，很想听到Angular球员的消息。 – BradGreens 2013-03-22 19:29:04

这感觉很奇怪......但我现在增加了一个指令到元素......整齐。 – BradGreens 2013-03-22 20:09:29

没有jQuery的AngularJS DOM /文档选择

回答

相关问题