javascript - Angular : How to get an element by id with an expression from a directive?

标签 javascript angularjs angularjs-directive

前面的问题很大,所以让我们分解一下。我尝试实现与 native 类似的行为 <label>对于 <input> .我不能嵌套它们,所以我使用这样的样式:

<input type="checkbox" id="test" />
Some other content...
<label for="test">Lorem ipsum</label>

以我为例 <label>是自定义指令,<input>是任意元素。它可能看起来像这样:

<p id="test">Some element...</p>
Some other content...
<custom-directive for="test">My directive</custom-directive>

可悲的是我的id不是真正静态的。它是一种表达。它可能看起来像这样:

<p id="test-{{ foo }}">Some element...</p>
Some other content...
<custom-directive for="test-{{ foo }}">My directive</custom-directive>

现在我的问题是:里面 <custom-directive>我想获取 for 中配置的元素属性。让我们说 foo具有值 "bar"设置在 $rootScope里面<custom-directive>我得到 foo-bar .但是,无论我在哪里尝试(在 compilelinkcontroller 内,有或没有 priority 等),特定元素(此处为 <p> )仍然有 test-{{ foo }}那时,所以我得到nullgetElementById .

如果元素有一个 id,我怎样才能得到指令外的元素?包含表达式?

这是一个例子:http://jsfiddle.net/cd6uooze/

(注意:在我的真实世界应用程序中,这个问题略有不同。我实际上可以 getElementById 来自指令的正确元素,即使它 id 包含一个表达式。然而,这只在特定模板在里面时有效$templateCache 。我无法在 JSFiddle 中真正分解它,但它与 JSFiddle 中的示例非常相似。)

最佳答案

您需要在 $timeout

中编写您的 getElementById 代码

检查此更新 fiddle .

关于javascript - Angular : How to get an element by id with an expression from a directive?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27984403/

相关文章:

javascript - 如何删除以下热图中的现有标记并添加新的标记集?

javascript - 获取事件单元格的行和列不起作用

javascript - 如何将 CanActivate 应用于除某些路径之外的所有路径

angularjs - AngularJS 中元素的指令模板唯一 ID

javascript - Angular 面包屑 "10 $digest() iterations reached. Aborting! "

javascript - 与 attr() 类似的函数,带有回调函数的参数

javascript - 在 angularjs 服务中捕获按键 - 元素无关

javascript - 解析.com : getting UserCannotBeAlteredWithoutSessionError

javascript - Angular Js ng-repeat 遍历 JSON

angularjs - 如何使用 ui-mention angularjs 库设置默认提及?