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.
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 ...