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.
2
votes
1answer
25 views
Angular js, weather api search city and using enter key
So the code allows me to show low and high temperature using the openweather api data.
I can see the data perfectly, if i declare the value of the city in the input (ex: value ="houston")
but i want ...
1
vote
1answer
33 views
Unable to call Angular Directiive Method on Button Click
I'm trying to call directive method on button click from the calling controller.
Here is the directive code:
myApp.directive("helloDirective", function() {
return {
restrict: "E",
...
-5
votes
0answers
23 views
Which task runner is the best to automate in Web development front end? [on hold]
Which task runner is the best to automate? In Web development front end when optimizing assets like CSS, JavaScript, and images and other Server stuff.
1
vote
2answers
31 views
Why won't $compile work with service using a directive?
Please have a look at this example, since it is the best way to explain the problem.
In this example if you click the directive link, it does not compile the template, but instead displays it as "{{...
0
votes
0answers
39 views
for…in loop in Angular JS
I have written custom upload directive and part of this directive is adding preview thumbnail images. Code is below.
My problem; when uploading multiple images it must iterate "e"
...
for ( var e in ...
0
votes
1answer
31 views
AngularJS - Update controller var on route change
I'm pretty much a newbie in the AngularJS world.
This is my problem. I would like to update the selected tab based on the url, so that the selected tab changes when the url changes.
This is my js:
...
1
vote
1answer
14 views
nested ng-repeat in angular js not showing anything
i am having this inside my controller method.
var employee = [{name:"ankur",dept:"IT",company:"wipro",under:[{name1:"ashish"},{name1:"akash"},{name1:"tyagi"},{name1:"mogra"}]}];
$scope.employee = ...
0
votes
0answers
15 views
Angular directive, how to show self closing Alert Messages using directive
I am trying to create a directive to show the success/error messages which will be self closing(like fade-in and fade-out), implemented the basic directive, html and controller.
Below are the code ...
0
votes
1answer
10 views
Cancelling a $document event listener in Angular
I have a created a listener to catch the keypress events using $document.on and it works fine . The problem here is I want the listener to be active only when a particular modal is open and when its ...
0
votes
2answers
38 views
Directive to hide elements of guest user
I want to create a directive that could hide specific element for guest user. Currently I have this:
angular.module('someMod')
.directive('premiumUser', premiumUser)
.controller('...
0
votes
0answers
10 views
Breaking ng-repeat by dynamically compiling additional directive to element
situation is as following:
I am trying to build a responsive table, that hides columns if there is not enough space available and (at the end) displays the hidden column's information below each row.
...
0
votes
2answers
33 views
Move element up against window scroll in a directive then apply fixed position
I'm using an angular directive and binding the scroll on the window element. On scroll, I want to move the element against the direction of the scroll up. Then, when boundingRect reaches 50, I want ...
2
votes
2answers
61 views
Angularjs Modules - Packaging Directives and Their Controllers
I have the following javascript code and i ran into a issue:
My .js file
angular.module('MyApp',['ngMaterial','ngMessages'])
.controller('MainCtrl',['$mdDialog',function($mdDialog'){
this.openDialog ...
1
vote
0answers
22 views
How to update a variable in controller (ControllerAs syntax) from directive in Angularjs?
I have a dropzone directive:
function dropzone() {
return {
restrict: 'C',
link: function(scope, element, attrs) {
var config = {
url: 'http://192.168....
-1
votes
0answers
7 views
Custom directive not rendering with ionic on iOS
I created a custom directive that is a card list in ionic.
Whatever I do, this directive is not rendering on my iPhone.
Here is everything I tried so far:
Checked my templateUrl is good and does ...
1
vote
0answers
27 views
$compile issue with dynamic backdrop in directive
I have built a directive that generates a sliding menu. It's still a work in progress but I have ran into a small issue I want to tackle first before anything that I started to notice.
I will start ...
0
votes
1answer
22 views
How to test an Image onload function within an $observe in karma
I have the following directive which tells me whether or not the image i'm trying to use has loaded successfully or not:
return {
restrict: 'A',
scope: {
imageLoad: '@'
},
...
0
votes
0answers
16 views
Map loads incorrectly with Angular-Leaflet-Directive
Good morning!
I have a web application, where I use a leafletjs map (http://tombatossals.github.io/angular-leaflet-directive/#!/) and openstreetmap as tile.
The map works perfectly, I can interact ...
0
votes
0answers
12 views
Angular design pattern for for building nested object forms with individual templates
The basics is that we have already have a matter form built.
We want to build a extend form of with more data added on the matter.
We already have a directive with a lot of functions and data ...
0
votes
1answer
24 views
Passing div id to directive in angular
I have the following directive:
.directive('addfields',function($compile){
return function(scope,element){
element.on("click",function(){
var enviroElement = angular.element('<enviro-...
2
votes
1answer
48 views
How to achieve this hover effect using AngularJS?
What I am doing here is when I hover over the wrapper section an overlay is rendered and clicking in that overlay change the CSS of input border and remove readonly attribute of input and vice versa.
...
0
votes
1answer
29 views
bar color of the piechart not display in angularjs ng-repeat
hello i am new in angularjs following is my code of the html.
<div class="circular-bar" ng-repeat="cat1 in ['15']">
<div class="chart" data-percent="{{cat1}}" data-bar-color="#e75200"&...
0
votes
0answers
18 views
How can we do fancy animations or hovers using Angular that we are doing using jquery and javascript?
I have gone through google and many tutorials but I can't find proper solution to my problems. I have been hearing that we must start thinking the angular way. But I am not getting the thing in my ...
0
votes
0answers
30 views
how to attach excel file on send email in angular js
i am used angular js for creating excel file but now i include also that file in my email from how to that possible.
my js code:
$scope.email = function () {
var blob = new Blob([...
0
votes
0answers
15 views
How to display folder icon if there is no child node under folder using angular treecontrol?
I am using angular directive treecontrol to display folder and files , when there is no child node under folder , folder icon is hidden so i want to make folder icon visible all the time. Any idea how ...
0
votes
1answer
24 views
inserting a directive every time a button is clicked
I am working from a tutorial here: https://fourtonfish.com/blog/2014-01-dynamically-add-directives-in-angularjs-no-jquery/
However, I want to create a directive and inject this into my HTML every ...
1
vote
0answers
43 views
Is there a reason for so much repetition in Angular directives?
Recently I have been coming across a lot of repetition in Angular.
Example:
ngShow vs ngHide
Pristine vs Dirty
valid vs invalid
Won't ng-show="!condition" and ng-show="condition" cover all cases ...
0
votes
2answers
29 views
angularjs 1.5 override templateUrl
For a directive like below, is there a way to override the 'templateUrl' property so that instead of myTemplate1.tpl.html myTemplate2.tpl.html can be used? This is because the directive has already ...
2
votes
3answers
54 views
Angular2 - Input Field To Accept Only Numbers
In Angular2, how can I mask an input field(textbox) such that it accepts only numbers and not alphabets?
I have the following HTML input:
<input type="text" *ngSwitchDefault class="form-control" (...
0
votes
1answer
17 views
angular provider get method has no reference of set variable from config block
I have below serviceURL Angular Provider in my project.
app.provider("serviceURL", function () {
var cartServiceBaseSite = '';
var domainName = '';
var GetRatingURL = domainName + '/comments....
1
vote
1answer
22 views
AngularJS: Cannot get innerHTML of dynamic element within a directive
I am trying to get the innerHTML of an element with dynamic content form within a directive.
Below is the Plunker:
https://plnkr.co/edit/rXVin1LPWzpH4eMqZc7R?p=preview
The one in green is the ...
1
vote
2answers
37 views
Button in angular directive not executing ng-click function
I am new to angular and am having issues setting up a custom directive. The point of the custom directive is that when it is hovered over a button should be displayed that when clicked executes a ...
1
vote
1answer
33 views
AngularJS 1.x caching compiled link functions
Concerning directives in AngularJS 1.x I was wondering if anyone saw any issues with caching link functions that are returned from the $compile service. For example...
myDirectiveModule.directive('...
1
vote
2answers
36 views
AngularJS - directive scope model doesn't update without debugger
For create/edit a website content I have a form with some tabs (buttons making the idea of tabs system because the user may want to add another "tab", etc, etc) and I use a directive to show the ...
0
votes
1answer
29 views
variable is not acting independently when using multiple copies of same angular directive
I'm trying to create a directive with 2 radio button binding with update variable. Now I planned to use the same directive in once again. Now the problem is the scoped variable update is not acting ...
0
votes
0answers
39 views
AngularJS OrderBy not working in angular 1.5
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.2/angular.min.js"></script>
<script>
angular.module('...
0
votes
1answer
21 views
Reader.onload upload image file to blob angularjs
I'm in this problem a days. What happens is the following when I try to click the update image button I can not do the image update on the first try despite my console.log it return me the correct ...
0
votes
1answer
9 views
Microsoft.Maps.loadModule with Angularjs
I am using Microsoft.Maps.loadModule in a directive for AutoSuggest functionality. Problem is that script is loading async and my directive trigger before script is loaded... Can you provide me with ...
0
votes
1answer
20 views
Reusing code for several UI-Select in angular app
How can I reuse code if i have more than one ui-select in my angular app and all dealing with different remote API to show options?
With reference to AngularJS Wrapping a ui-select in a custom ...
1
vote
0answers
24 views
ui-view inside the ui-view
I am creating single page application, when i load the page my index.html will start with login page, in index.html i am using ui-view, login page is load inside the ui-view, and when i logged in home ...
0
votes
2answers
30 views
What is the best way/practice to list titles of the months (Angularjs)
What is the best way/practice to include the titles of the months in html if you are making Angularjs project?
here is snippet of the ugly hard-code that I want to make better:
<div>
<...
0
votes
1answer
24 views
How to have data synced between directive controller and parent scope
I know that this probably have been answered several times, and it might even be pointed out in Angular documentation, but I can't for my life understand how to do this 'correct'.
I have a directive ...
0
votes
3answers
36 views
Not Able to access ng-model value in controller
I am having a code in which I am trying to access the ng-model values inside the angular controller but getting undefined everytime I am trying to call the ng-model value.
Code
var app = angular....
0
votes
0answers
31 views
No api call in angular directive
I have come to know that api calls should always be handled in services and not done in directive. Can somebody throw some light on it? What are pros and cons if I make api call from directive?
0
votes
1answer
43 views
AngularJS Directives - why do I need to call $compile in link() for expression defined in compile()?
I have this code:
app.directive('foo', function($compile) {
return {
restrict: 'E',
scope: {},
template: '<span>{{bar}}</span>',
compile: function(element, attrs) {
...
-1
votes
0answers
21 views
$digest 10 times inside directive with default filtering
I am trying to implement pagination and filtering within a custom directive. Everything works fine but there are many errors showing 10 $digest iterations reached.
The filtering works as follows:
&...
0
votes
0answers
15 views
Angular 1.5 component templateUrl not working
I have just started using Angular 1.5 components and have the following snippet of code
angular.module('vizzle').component('teacher', {
bindings: {},
/* @ngInject */
templateUrl: '/app/...
1
vote
1answer
34 views
How to add item cost in Angularjs?
I want to add work item cost but its show original value.
Example:
item[1].cost =2 ,item[2].cost = 2 ..
When I add 3rd item[3].cost = 8 it's Total = 228. I want add SUM, how to do this? I want ...
1
vote
2answers
35 views
Angular, directive isolate scope
Still trying to learn Angular
I have a plunker here https://plnkr.co/edit/3FLmBtHP5TuOwWZHBMLK?p=preview
I'm just trying to create an example of a directive with isolate scope.
I'm using $http and ...
0
votes
0answers
23 views
ng-enter not working when I use controller as syntax
I am trying to use ngEnter directive in my angular app
app.directive('ngEnter', function () {
return function (scope, element, attrs) {
element.bind("keydown keypress", function (event) {
...
