问题标签 [angularjs-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 回答
189 浏览

angularjs - 如何调用函数来更改指令中的值?

我需要这样的东西,但它不起作用

0 投票
2 回答
1856 浏览

angularjs - 如何制作可重用的 AngularJs 组件

这似乎应该很容易,但我找不到关于它的文档。我想知道如何使 Angular 组件(比如说过滤器)在不同的应用程序中可重用。我制作了一个简单的过滤器来格式化电话号码,我希望能够在任何应用程序中使用它。目前它是这样声明的:

问题是如何使这个过滤器可重用。现在它只是附加到“myModule”,但我怎样才能把它从这个文件中取出,以便我也可以在其他地方重用它呢?

0 投票
4 回答
52042 浏览

angularjs - 从内部指令将参数传递给 ngChange 事件调用

我有一个接受ng-change属性的指令:

我在控制器中定义了一个函数,myCallback如下所示:

以下函数 select 存在于我的radioButton指令中。我需要在 select 函数的指令中定义何时执行 ngChange 回调:

我遇到的问题是,当我在指令的函数中$event执行时,参数myCallback没有传递。myCallbackselect

小提琴: http: //jsfiddle.net/dkrotts/BtrZH/7/更新:http: //jsfiddle.net/dkrotts/BtrZH/8/

我究竟做错了什么?

0 投票
2 回答
36124 浏览

javascript - AngularJS文件拖放指令

这个例子几乎完成了我想在 Angular-js 中移植的内容:HTML5 File API

我一直在尝试搜索一些指令示例,但是我发现了大量使用 DOM 或不是为 Angular 1.0.4 编写的旧示例。

基本上这是纯js代码:

我能想到的唯一可能的方法是创建一个指令

但是(1)它不起作用,(2)在我修复它之前,我想知道是否存在某些东西或者我是否做得正确,

非常感谢任何提示或帮助。

0 投票
1 回答
282 浏览

angularjs - 在没有控制器的情况下迭代服务结果的指令

我正在研究使用 AngularJS 作为以声明方式定义 Web 组件的框架的可能性(尽可能避免对控制器的需要)。所需的大部分功能已经可以通过 Angular 的内置指令实现,但是我还希望能够迭代用于异步请求数据的各种服务的结果。

我需要的功能可以通过将服务注入控制器并将结果存储在范围内来轻松实现,但我希望有一种方法可以实现这一点而根本不需要控制器(具体来说,我希望生成模板而不是手写)。

是否有任何内置方法可以在 Angular 中实现这一点(例如,一种包含对重复表达式的服务调用的方法)?如果不是,那么实现这一目标的最有效方法是什么?我会假设我应该能够创建一个引用服务的新指令,但我不确定这是否是实现这一目标的正确方法。

0 投票
3 回答
17400 浏览

javascript - 如何创建自定义输入类型?

例如,我想创建一个类似于 AngularJS 实现“电子邮件”的方式的自定义输入类型。

我想创建的是这样的输入类型:

关于如何实现这一点的任何想法?到目前为止,我只能弄清楚如何实现自定义指令,其中“路径”是标签、属性或类的名称。

例如,我可以让它工作,但它与其他表单字段不一致,我真的希望它们看起来一样。

0 投票
1 回答
4154 浏览

javascript - AngularJS:将 $scope 传递给指令

尝试使用 jQuery File Upload 插件和该指令的要点创建文件上传指令https://gist.github.com/thoughtpalette/4726114

我需要将 profile-ctrl.js 中对象的 id 传递到上传表单的提交功能中。

我的指令位于控制器之外,我无法将对象设置为 $rootScope 以在指令中捕获/传递它。

url: in fileupload 是魔法发生的地方。通过 api 调用我的控制器并传递文件信息,并希望在 profile-ctrl.js 中的商家对象中传递 vendorId。$scope.merchant

不幸的是,由于项目结构,我无法在小提琴中发帖

我的指令:

通过 html 的指令调用:

所以现在商家在指令中返回未定义。有人可以帮我把它传进去吗?

0 投票
1 回答
428 浏览

angularjs - 为什么“ng-switch”-ing时事件停止被捕获

我有一个文件上传指令,它在文件上传时触发事件(通过scope.$emit),然后在我的控制器中捕获(通过scope.$on)以更新进度条。文件上传指令被ng-switch删除,因此用户可以在文件上传时填写有关文件的其他信息。我希望进度条在他们执行此操作时不断更新。这在 1.0.2 版本中一切正常,但现在在 1.0.4 中似乎被破坏了。

我创建的 jsFiddle大大简化了,但它显示了问题。当页面第一次加载时,该事件被指令触发,它被控制器捕获,一切都按预期更新。但是,如果您更改下拉列表以使指令ng-switch退出,则该事件将停止被捕获。如果您查看控制台,该事件仍在 gettting $emit-ed,但控制器只是停止捕获它。即使我把它$on放在$rootScopehttp://jsfiddle.net/uysAM/1/)上,它仍然有同样的问题。如果事件仍在$emit-ed 中,为什么范围会停止捕获它?

如果您将<script>顶部标签中的 src 更改为使用 1.0.2,它就可以正常工作。这是最新版本的一些新错误吗?谢谢你的帮助。

0 投票
1 回答
916 浏览

angularjs - proper way to assign and use controller in directives in AngularJS

how to correctly assign a controller to a directive so 2 directives can communicate to each other. When I set the require argument of the second directive to the name of the first directive i get an error in the console:

Error: No controller: dir at Error () at getControllers (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:4132:19) at nodeLinkFn (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:4259:35) at compositeLinkFn (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:3869:15) at compositeLinkFn (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:3872:13) at nodeLinkFn (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:4252:24) at compositeLinkFn (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:3869:15) at compositeLinkFn (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:3872:13) at publicLinkFn (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:3775:30) at http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.js:934:25 <div class="btn btn-danger" dir2=""> angular.js:5601

(anonymous function)angular.js:5601

(anonymous function)angular.js:4698

nodeLinkFnangular.js:4261

compositeLinkFnangular.js:3869

compositeLinkFnangular.js:3872

nodeLinkFnangular.js:4252

compositeLinkFnangular.js:3869

compositeLinkFnangular.js:3872

publicLinkFnangular.js:3775

(anonymous function)angular.js:934

Scope.$evalangular.js:7905

Scope.$applyangular.js:7985

(anonymous function)angular.js:932

invokeangular.js:2813

bootstrapangular.js:930

angularInitangular.js:906

(anonymous function)angular.js:14600

cjquery-latest.min.js:3

p.fireWithjquery-latest.min.js:3

b.extend.readyjquery-latest.min.js:3

H

Here's an example in plnkr.

Edit :

I'm trying to do something that is present in a lot of websites, change the view template by clicking on a button or link from list view to thumbnails view etc... I thought about making 2 directives one called "switcher" for the button switcher and the other called "switchable-view" for the view. here's a plnkr with an example code. The idea is when i click on the "switcher" directive it switch the template in the switchable directive which will result on switching the view, I hope this is clear enough. what i'm trying to do is something like this plnkr

Thanks in advance.

0 投票
8 回答
39857 浏览

unit-testing - Jasmine 使用 templateUrl 测试 AngularJS 指令

我正在用 Jasmine 为 AngularJS 编写指令测试,并与它们一起使用 templateUrl:https ://gist.github.com/tanepiper/62bd10125e8408def5cc

但是,当我运行测试时,我得到了要点中包含的错误:

从我在文档中读到的内容来看,我认为我这样做是正确的,但似乎并非如此 - 我在这里错过了什么?

谢谢