问题标签 [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 投票
2 回答
507 浏览

angularjs - 角度指令和 Ajax 调用之间的时间问题

我正在执行一个获取一些信息的 ajax 调用: <span id="test" abc-dir="test"> </span>

现在,我还有一个角度指令,我需要在通过 ajax 返回的上述信息上运行。

问题是:首先启动 Angular 指令并尝试在 DOM 中找到 abc-dir 但是由于 Ajax 调用未完成,它什么也不做。如何先触发 ajax 调用,然后再调用 Angular 指令?

我的 HTML 代码:

<body ng-app="TestApp" ng-controller="TestCtrl" ng-init="init()"> <div class="test" id="testid"></div> <script> require( ['jquery'], function($) { $.ajax({ type: "GET", url: "....", success: function(data) { document.getElementById('testid').innerHTML = data } }); }); </script>

我的 Angular 指令代码如下:

angular.module('TestApp', ['ngSanitize']) .directive('abcDir',['abcPropertyMap',function(abcPropertyMap) { return { restrict: 'A', template: function(elm,attrs){ var value = abcPropertyMap[attrs.abcProperty]; return '<span ng-bind-html="'+value+'">x</span>'; } } }])

0 投票
3 回答
1888 浏览

angularjs - 如何将标签的内容绑定到指令的范围内?

假设我有这样的指令:

如何将元素的内容绑定到指令的范围内?

0 投票
1 回答
7130 浏览

javascript - 在 Angularjs 中使用 GeoCharts

如何在 Angular 中使用 Google GeoChart?我想在 Javascript https://developers.google.com/chart/interactive/docs/gallery/geochart?hl=it#Regions中像这个例子一样在 geoChart 中注入角度数据

一些忠告?

0 投票
2 回答
3428 浏览

angularjs - ng-repeat 中的 AngularJS 动态指令

我正在尝试在 ng-repeat 中动态创建指令。我有一个directive-writer创建许多其他指令但directive-writer似乎没有输出指令属性的指令。所以第二组指令永远不会被渲染。

有关完整演示,请参阅此 Plunker

简而言之,我有这个指令标签:

范围数据:

指令定义:

还有 3 个类似的指令:

问题是directiveWriter不会将tAttrs.directiveType值作为属性仅作为文本写出......

所以渲染的 HTML 是:

其中“三”在 div 内呈现为文本没问题,但从不呈现为属性。

我不明白:

  • 为什么文本“三”可以作为文本绑定在 div 内,但不能作为属性。
  • 为什么类设置为“ng-binding”。
0 投票
0 回答
109 浏览

javascript - 在自定义指令中访问 ngModel `$name`

对于我的指令,我有以下内容可以让我到达我需要去的大部分地方,我的问题是执行函数时ngModelCtrl有一个未定义的属性。我的意图是为其命名,以便指令管理指令中设置的命名模型并将对该命名模型的更改向上传播到:$name.toggleFlyout()ng-modelscope.$parent

编辑:这里尝试的 Plunkr: http ://plnkr.co/edit/uD21fH62GLA5THs8ZuPj

<button data-ng-model="flyoutIsToggled" data-flyout-toggle>Toggle Flyout</button>

0 投票
1 回答
4698 浏览

angularjs - gulp-minify-html 删除空的 HTML 属性,导致 Angular 应用程序出现问题

我最近正在转换一个 AngularJS 应用程序以使用 Browserify,同时,我正在从 Mimosa 切换到 Gulp 作为我的构建系统。

在处理了许多其他小问题之后,我遇到了一些问题:

  1. 使用 ng-switch 和 ng-switch-when 时,我的 index.html 中不断出现以下错误:

    Error: [$compile:ctreq] Controller 'ngSwitch', required by directive 'ngSwitchWhen', can't be found!

  2. ng-include 对我不起作用(没有错误消息,只是没有包含任何内容,也没有发出网络请求)。

  3. 我的自定义属性之一中的代码从未被调用,即使它显然是我原始 index.html 文件中 HTML 标记的一部分。

我花了很多时间尝试各种事情来查看问题可能是什么,但最终按照我下面的答案中的描述进行了追踪。

0 投票
1 回答
2136 浏览

angularjs - 清理来自 textangular 的文本输入

我正在使用textangular作为我正在从事的项目的富文本解决方案。

需要清理此输入,因为我们只允许某些 html 标记。

由于这不是 textangular 的默认可能性,我创建了一个包含 textangular 指令的指令。我可以成功清理输入文本,但视图永远不会更新,我已经没有想法如何实现这一点

指示:

日志打印出模型,它表明它实际上是变化的。我只是不知道如何在 textangular 中更新实际的 textarea。

任何人都可以帮我解决这个问题,或者让我朝着正确的方向前进吗?

0 投票
1 回答
353 浏览

angularjs - 如何在Angular Js指令中部分调用控制器

我为 Tab 创建了一个指令,它对静态控制器工作正常,但是当将添加控制器添加到任何一个模板时,它什么都不显示。

我的 Tab 指令在这里

局部范围

html中的指令

head.html 的内容

SystemHeadendCtrl.js

当该选项卡处于活动状态时,它不会在 head.html 中显示任何内容。

0 投票
0 回答
482 浏览

angularjs - 角度 - 指令范围没有被破坏

我对 AngularJS 和编译功能有一个非常奇怪的问题: http ://plnkr.co/edit/7W9AbpaLqsYCecOWdIlz?p=preview

我写了一个简单的 $compile 结构,所以我可以动态插入不同的 html 模板。

如果您查看 BodyController,您将在“INIT”事件中,我正在更改我的状态并显示 UI。

在我跳回登录并改回 GAME 后,他显示了 3 次“Test1”,以及 1 次“Test2”,但应该只显示“Test1”一次。

此外,预编译指令不会被破坏并被执行。

我每次都在触发 scope().$destroy 事件,但似乎核心没有正确意识到这一点?

希望有人能帮助我。谢谢

编辑:交叉链接:https ://github.com/angular/angular.js/issues/9190

更新:发现问题,但不知道如何解决:

编译后:

angularScope ($rootScope) 添加一个监听器到:

此 $stateChangeSuccess-Listener 未清除

如果我自己清除它,错误就消失了 - 但不应该是正确的情况吗?

似乎子作用域的 $destroy-event 不会影响 $rootScope 上的侦听器。

0 投票
1 回答
168 浏览

javascript - 使用指令更新由 ng-repeat 创建的图像

我使用 sockte.io 从服务器获取我的数据,并且取决于我必须更改图像的数据(item.text)。我尝试访问 DOM 并使用指令修改图像,但没有运气。

这是我的代码:

HTML:

JS:

我该如何解决这个问题,或者是否有更好的方法来做到这一点。

更新:

在给定时间图像不一样,我想使用它们的索引访问每个图像的索引。

更新: 我添加了这个示例,如何修改例如具有“文本 2”的图像