问题标签 [angular-directive]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
980 浏览

angularjs - 以角度将动态方法传递给自定义指令

我正在创建自定义指令,我需要在对象内部分配函数,该函数将在传递给我的指令时使用。但是,如果我通过直接在模板中写入函数的名称来传递方法,它的工作正常。但是,如果我将该方法引用分配给我的一个对象属性,然后我在我的模板中使用它来将它传递给指令,但这不起作用。

你可以在这里看到 - jsfiddle

您可以在控制台中看到。单击“保存”按钮,它将在指令内调用保存函数,但从那里我正在调用不起作用的控制器方法。但是如果你改写函数名blabla,那么dynamicMethods.myMethod它会调用,但我在警报中没有定义。

谢谢你。

0 投票
2 回答
1110 浏览

javascript - 从 AngularJS 中的“父”控制器调用指令 API 方法

我有一种情况,我想创建自定义组件,它应该是可重用的,并提供公共 API 来改变它的状态。我试图通过使用指令和控制器构建组件来实现这一点。

我想做的只是:

customComponent.apiMethod1( Math.floor( Math.random() * 2 ) );

这是JSFiddle,它应该解释我的情况: //jsfiddle.net/7d7ad/4/

在第 9 行(当用户单击按钮时),我想调用第 22 行方法(自定义组件公共 API 方法)。有没有办法做到这一点?

0 投票
1 回答
340 浏览

javascript - 数据更改时的 angularjs 和 ng-init 范围

所以我有一个日历应用程序,现在用户选择开始/结束日期并单击更新日历。这会填充一个日历。但是,我在范围中包含新元素时遇到了麻烦。例如,我不想一次又一次地使用相同的函数从开始日期、周数、星期几等计算某个单元格的“单元格日期”,我想将单元格日期一次存储到其范围内并让其他人使用它。尽管进行了多次尝试,但不知何故我无法做到这一点。在下面的 JSFiddle 中,您会注意到每个日历单元格的右上角显示月份中的日期。但是,如果您更改日期,比如上个月,当月的天数会更新,但我在单元格中显示的“单元格日期”不会更新!

例如,以“2014 年 7 月 5 日星期六”为例。将日期更新为从 6 月 1 日开始,最右边的单元格仍然是“2014 年 7 月 5 日星期六”,尽管它的日期是 6 月 7 日!相关代码在“calcell”指令和“events”指令中。在 calcell 中,我将 celld 设置为 ng-init='celld=cellDate(num, start_dt, $index)'。然后在事件中我只是使用 {{celld}} 显示。我可以通过在事件中使用 cellDate(num, start_dt, $index) 来让它工作,但我真的不想在任何地方都使用相同的函数一百万次。有没有办法可以将单元格日期存储在单元格对象中,并在子范围内使用它并在数据更改时更新?最终,我会将单元格日期传递给函数以获取该日期的事件数据,然后事件将遍历它们以显示事件数据。

小提琴链接

谢谢!

0 投票
4 回答
13753 浏览

angularjs - 我如何验证角度多选?

我正在使用来自http://isteven.github.io/angular-multi-select/的 angular-multi-select 。它根据我的需要工作。我正在以模态形式使用多选,我想验证它,但是当我使用必需选项时它没有验证。谁能建议我如何在表单中验证角度多选。

代码

提前致谢

0 投票
1 回答
2208 浏览

angularjs - Angular js创建一个通用指令

我正在尝试用 Angular 创建一个通用指令,例如,使用这个 html:

并采取这个控制器:

并接受这个指令:

这个想法是有一个模板,可以为不同的文本输入标签提供不同的占位符。有没有好的方法来做到这一点?

我正在考虑从正在观看的输入文本中获取模型,然后对其进行处理,但这无助于我设置占位符并初始化输入文本字段。

0 投票
1 回答
8264 浏览

javascript - AngularJs - 将一个 ng-model 绑定到具有两个输入的指令

如何创建一个range绑定到一个并使用(已经制作的)ng-model输出两个字段的指令。基本上我有一个从模型到输入工作的方向,但从输入到模型的另一侧没有。如何做到这一点?inputfilter

我有这个HTML:

还有一个模型:

边注; 我创建了一个过滤器来拆分这两个值:
{{ feature.Value | split:\'/\':0}}

而这个指令:

0 投票
1 回答
76 浏览

javascript - 角度指令可能是也可能不是另一个角度指令的子指令

最近我决定学习 Angular。这是一个很棒的框架,我玩得很开心,但我已经了解了它真正的肉和土豆部分:指令。我认为它们可能是自 CSS 转换以来 HTML 发生的最好的事情。我建立了一个网站,在几个地方使用了一种奇怪的更改标签格式(页面的内容加载到这些标签中,FAQ 页面使用了一个变体)

在我自己的混乱中,我偶然发现了这个<menu>标签,并记得我对它的失望。我想构建一个指令,将菜单标签更改为自己的网站导航菜单类型,并为具有子菜单作为子元素的项目提供下拉菜单。例子:

我希望隐藏菜单项标签内的菜单,直到将鼠标悬停在“某物”的菜单项上。我希望这适用于<menu> -> <menu-item> -> <menu> -> ...实际导航菜单可能需要的任何组合。

这是来自我的 javascript 的正在进行中的信息,请记住,我一直在摆弄,看看我是否能得到一些工作。

我现在的主要问题是:对于 0 级元素(也就是没有子<menu>标签),我如何收集传递的 HTML 值并将其设置为传递给带有子<menu>标签的项目的 menu-title 属性?

任何帮助表示赞赏。我知道答案与 transclude 功能有关,我只是不确定如何使用它。我之前已经将 $transclude 传递给菜单项控制器,但是$scope.menuTitle在传递的函数中设置属性并没有改变任何东西 - 链接都显示为空。

注意## 我正在使用引导 css。

0 投票
1 回答
1480 浏览

javascript - 根据正确选择的单选按钮显示下拉菜单

问题:

如何显示所有单选按钮,但只有一个下拉菜单。这个显示的下拉菜单反映了当前选择的 radiobtn?

实时代码

html:

javascript:

0 投票
2 回答
859 浏览

javascript - 删除一个被嵌入的元素

我有一组自定义指令可以通过 nav 标签有效地构建可嵌套的导航菜单。之前对如何获取转入文本的内容有一些疑问。虽然我已经弄清楚了,但我现在想知道是否有任何方法可以删除嵌入的元素,以便之后它不会出现在模板中使用 This Plunker,您可以看到元素正在获取嵌入元素的文本。但它仍然包含在ng-transcludediv 中。

您将能够看到 plunker 中的代码,但 plunker 中的相应代码是:

我对$transclude价值的了解很少——我在这里工作的那篇文章只是通过大量谷歌搜索和检查问题偶然发现的。

感谢您提供的任何帮助。

0 投票
4 回答
7733 浏览

angularjs - angular-ui-tree:放置位置 + 在指令中捕获放置事件

我正在使用angular-ui-tree在我的应用程序中构建项目树。我正在使用它的拖放功能,我需要知道拖放发生的时间和位置(在什么元素上)。

例如,我将 item1 拖放到面板上。我希望面板显示项目名称。(每个项目都有一个名称属性)。面板只是一个简单的 div,里面有文本。

我在文档中看到我可以访问控制器中的“dropped”事件。但我不明白如何根据拖放的项目更改面板内容。