AngularJS directives are a way to teach HTML new tricks by extending the HTML vocabulary. Directives allow you to manage DOM elements in a declarative pattern, freeing you from low level DOM manipulation tasks.

learn more… | top users | synonyms

0
votes
1answer
28 views

AngularJS - Directive to Directive function call

Directive One myApp.directive("myDirective", function ($compile, $rootScope) { var linker = function (scope, element, attrs) { var myEl3 = angular.element(document.querySelector("#...
1
vote
1answer
70 views

Angular Directive - Correct order of execution of functions

Being bit confused as per the following 2 blogs: I. Eric W Green - Toptal https://www.toptal.com/angular-js/angular-js-demystifying-directives Order of execution Compile -> Controller -&...
0
votes
3answers
20 views

how to call twice nested method in angular 1.x?

My HTML looks like this: Controller HTML: <div ng-controller="Ctrl"> <first-directive></first-directive> </div> first-directive HTML <li> <second-directive>&...
1
vote
3answers
45 views

Why the expression is appearing as it is in AngularJS example?

I've following code : <!DOCTYPE html> <html> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> <body> <p>Try to ...
1
vote
3answers
746 views

orderBy case insensitive in ng-repeat

How do I use the filter orderBy to sort data in regardless of the case (case insensitive) in an ng-repeat clause? Do I need to write a custom function to do that? If so are there any examples please? ...
2
votes
2answers
756 views

AngularJS ng-repeat applied multiple times in $compiled directive

I've written a directive that dynamically creates a popover for an element: app.directive('popover', function($compile, $timeout){ return { link: function(scope, element, attrs) { ...
9
votes
2answers
11k views

AngularJS Directive Two-Way Data Binding Not Working When Observing Boolean

I have a two-way data binding that is not altering the value of the variable sent to the directive. My directive watches for a trigger and gives focus to the associates element (based on code found ...
0
votes
0answers
18 views

Angular Advanced Searchbox - Multiple Choice select

I am trying to get this directive to work with multiple select per parameter. For example i want to add to the parameter suggestion a extra attribute (groupValues), which could be like this: { ...
0
votes
1answer
16 views

How to execute Angular ng-click directive inside custom component on enter key press

I have a custom icon component using isolate scope where a user can define what he or she wants to happen on ng-click: <ers-icon name="history" ng-click="ctrl.clickAlert('history')"></ers-...
0
votes
2answers
19 views

How to delay the google autoComplete function to save credit

As you know every time when we type the google map autoComplete will fire, I want to set a delay function for this, such as 250ms,so give user more time to type and also save the credits. I try to add ...
0
votes
2answers
23 views

Can I use a Directive in the template function?

So this is a simple example i just wrote up for the sake of this question, I'm curious if I'm able to use a directive and pass in an object to the directive's attribute, all in the template, not ...
3
votes
1answer
1k views

Behaviour bindToController in child scope versus isolated scope

I was playing around with the bindToController option for directives. I stumbled upon a seemingly strange difference between the behaviour using a child scope compared to an isolated scope. When I use ...
2
votes
4answers
36 views

Remove DOM-Element with AngularJS

I'm trying to remove a navbar based on the current location path. This is what I have so far: angular.module('myModule') .controller('MainController', function ($location, $document) { if ($...
8
votes
1answer
8k views

Access parent element(body) in directive link function

Given a HTML structure similar to this: <body> <div id="one" my-directive></div> <div> <div id="two" my-directive></div> </div> </body&...
6
votes
3answers
18k views

Two way binding Angularjs directives isn't working

I have been trying to figure out the solution but I think i hit a dead end. So here is my directive directives.directive('postprocess', function($compile) { return { restrict : 'E', ...
0
votes
1answer
33 views

how can I pass 'scope' argument outside the directive

how can I pass 'scope' argument outside the directive? i need use it in some other component.. my code: (function () { angular.module('dmv.shared.components'). directive('doImportPackage', ['...
0
votes
0answers
29 views

How to append the same template twice within another template - Angular 1.5

I am an Angular newbie. Using Angular 1.5, I have a main template with a button. ui-sref on the button is linked with a ui-router that loads an image (another template). My requirement is to keep ...
0
votes
0answers
20 views

Angular isolate scope confusions - functions are undefined

I'm trying to create a tree-like structure with angular directives: profileApp.directive('adminList', function() { return { restrict: 'E', replace: true, scope: { ...
5
votes
1answer
318 views

How to display highcharts in ng-repeat angularjs

I'm trying to display charts in ng-repeat Here is html: <tr ng-repeat="perspective in perspectives"> <td> <highcharts-pie class="hc-pie" items="value"></highcharts-pie&...
0
votes
0answers
9 views

Requiring sibling directives to be initialized sequentially

I am trying to create a modal which has "pages" (each page is a "step" and there is a distinct order). Each page is defined by a directive with it's own controller and template. I want the modal to be ...
0
votes
4answers
3k views

How to initialize the value of an input[range] using AngularJS when value is over 100

I try to initialize a slider using AngularJS, but the cursor show 100 when the value is over 100. Setting the value 150 in a range [50,150] fails with this code : <html ng-app="App"> <...
0
votes
0answers
24 views

jquery created div to angular directive

I have this basic jQuery function that I am looking at creating as an Angular directive so that I can pass information the angular way. Any help on how to Angularize this would be great. I am ...
0
votes
0answers
21 views

How to pass data between main.js/components and directive?

I need to know how to pass data between main and directory. What I want to do is to active the directive automatically when main.js start on load. Directive code: angular.module('dmv.shared....
1
vote
1answer
370 views

angularjs create custom event directive

I have a simple Attribute restricted directive like: app.directive('akMouseOver', function () { return { restrict: 'A', scope: { mouseOver: '&akMouseOver' }, controller: ...
4
votes
2answers
679 views

Update cached templates

I make use of templateUrl and it works great! app.directive('myDir', function() { return { templateUrl: 'partials/directives/template.html' }; }; However... when I make changes to ...
1
vote
2answers
29 views

Filter not working in ng-repeat angularjs

Does anyone know how to filter in ng-repeat, the code is below. I want to filter with profile.full_name. <tr ng-repeat="job in customerjobhistoryCtrl.Jobs | filter:{customer.full_name: Profile....
0
votes
0answers
21 views

How to pass data between main.js and directory?

i need to know how to pass data between main and directory. what I wanna do is to active the directive automaticly when main.js start on load. directive code: angular.module('dmv.shared....
0
votes
0answers
18 views

angular directive scope got overriden

I am trying to use isolated scope for a directive which is having two way data binding. Please refer my code below: function singleSelectDropdownList(methodCallHelper, $timeout) { var ...
0
votes
1answer
26 views

Angular: using templateUrl breaks compile-link ordering in directives

I've came across with problem exposing api of directives in order to its interaction with controller. There is a simplified jsfiddle to describe my structure. The problem is that directives has ...
0
votes
0answers
19 views

ES6/AngularJs 1.5.5 directive/ngMessages Error: [$compile:ctreq] Controller 'ngMessages', required by directive 'ngMessage', can't be found

I am using angular.js 1.5.5 and ES6 My project uses gulp, webpack (I am mentioning this as I am not sure if this is causing any troubles around some exclusion/inclusion of angular-message.js in the ...
0
votes
0answers
19 views

Angular throwing cryptic error, can't figure out root cause

I'm developing a CRUD SPA with UI Router. Here's the state: .state('admin', { url: '/admin/', templateUrl: 'ui/admin.html' }); The link: <a ui-sref="admin"><span class="...
0
votes
0answers
13 views

Is there a cost associated with switching between isolated scopes?

For example if you have several isolated scope directives within a single page that all listen for the same broadcasted event will there be a performance cost associated with the context switching ...
12
votes
8answers
19k views

prevent multiple form submissions using angular.js - disable form button

I want to prevent multiple form submissions using angular.js. The question is related to this question. When the user clicks on a form submit button the value / label of the submit button should ...
7
votes
9answers
17k views

angularjs disable button on $http/$q calls

following the DRY principal, i want to write a button directive which keeps button disabled for the duration of $http class. I want to do this so as to forbid user from clicking the buttons multiple ...
2
votes
2answers
2k views

Asynchronous request and loading button with AngularJS

DOM manipulation within an Angular controller seems to be wrong. But this is not coming without a few headaches :) I have a button, and on ng-click, it will perform an asynchronous request in the ...
0
votes
0answers
35 views

How can I hook event handler for table rows dynamically with directive link?

I am writing a typescript directive and trying to hook the "click" event handler dynamically for all html table rows within the "link" property of the directive. I tried and it does not work. When I ...
0
votes
2answers
197 views

Use controllers to: Manipulate DOM

I have a ng-repeat-end-watch directive ..... return { restrict: 'A', link: function (scope, element, attr) { if (scope.$last === true) { scope.$evalAsync(...
0
votes
0answers
30 views

AngularJS Custom Directive using ng-options populated from service

I've really hit a brick wall with this, and I know I'm probably missing something here, but I'm stuck and need help. What I'm trying to do is use a service to populate the options in an ng-options ...
0
votes
1answer
25 views

Getting the sum of all values in object - ng-repeat

I feel like I am missing something basic here, and would love some help. I have some data that looks like this "playerPoints"{ "ted":{"military":3,"gold":2}, "bill":{"military":2,"gold":4} } ...
0
votes
0answers
7 views

angular directive stop blur and restore conditionally

I would like to create a directive that saves on blur. It should work as attribute on input element. I need to: call webservice on blur pause blur immediately on success proceed with blur, on error ...
1
vote
2answers
356 views

Angular 1.5 component attribute presence

I'm refactoring some angular directives to angular 1.5-style components. Some of my directives have behavior that depends on a certain attribute being present, so without the attribute having a ...
0
votes
1answer
203 views

How doess $doCheck will not have any impact if $doChanges is called?

AngularJS official documentation provided the following information in this regard. $doCheck() - Called on each turn of the digest cycle. Provides an opportunity to detect and act on changes. Any ...
4
votes
1answer
298 views

ng-switch-when-separator not working in angularJS

ng-switch is not working when i use ng-switch-when-separator . when I select settings the switch is pointing to default div angular.module("myModule", []) .controller("myController", function ($...
0
votes
2answers
3k views

How to resolve CORS ie same origin policy in angularjs

I am developing a mobile application in angularjs where I have to make call to web service. But, when I am making the call with $http.get it is giving the following error. XMLHttpRequest cannot load ...
-5
votes
1answer
34 views

How to upload image using AngularJS [on hold]

I am uploading image my code working fine when I use below HTML <html> <head></head> <body> <form action="http://www.example.com/customers/5832e319f1f1e5cc296e8802" method=...
0
votes
0answers
32 views

Angularjs form validation for existing value does not work

I have problem understanding why my directive, which checks form validation, does not work. My form definition: <body ng-controller="MainCtrl"> <form name="myForm"> <input ...
0
votes
2answers
34 views

how to upload file using Angularjs, multipart/form-data

i want to upload image using Angularjs anyone know how do this..REST API wants Content-Type:multipart/form-data www.abc.com/images/id Request Body { // --Boundary_1_1626119499_1392398808202 ...
1
vote
0answers
14 views

Passing All Parent Attrs Through Custom Angular Directive

I have two directives, one is well established/tested (in example dirB) and the other is a styling wrapper (dirA). I need to write a wrapper directive that will pass all it's attributes automatically ...
3
votes
2answers
949 views

What is the React equivalent of an Angular directive that only works on attributes?

For example you could have a directive in angular like so: angular.module('app') .directive('classy', function() { return { restrict: 'A', link: function($scope, $el) { $el.addClass('...
1
vote
0answers
12 views

AngularJS Compile Breaks Negative Number Input

I am trying to create a directive that will dynamically add attributes to a field. I got it working, but noticed there is an issue when it is used on number input fields. The input doesn't allow ...