Tagged Questions
In 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.
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&...
0
votes
0answers
17 views
AngularJS : Decision tree implementation
I am trying to write a quiz app.Below is the source code.Currently it is working like as below :
On Click start Quiz,first questions shows up.
User selects correct option and it moves to say ...
0
votes
3answers
40 views
$scope is acting global
I'm trying to learn directives and I have a bunch of directives that look like my code below. But for some reason, if every directive I define has a "$scope.data" or a "$scope.takeInClick", it seems ...
21
votes
3answers
17k views
How can I use HTML5 geolocation in angularjs
How can I use HTML5 geolocation in angularjs? I can get it using HTML5; but how can I pass it to angularjs scope in controller? any sample jsfiddle will save my day!
0
votes
1answer
27 views
Angular ngRepeat increase $index and render view accordingly.
Consider that I've got two views, view1 and view2.
I am getting an array from an API in View1. From there, I am trying to go to view2 and dynamically render view2 for as many times as there are ...
0
votes
0answers
9 views
Angular blocks events in children of contenteditable
I'm creating an editor with Angular.js, and the editor consists of a contenteditable directive div with inner elements that may represent different types of data (a person, a date, et cetera).
For ...
0
votes
2answers
36 views
angular directive does not work with input type = “number”
The code below works only when the input type is text, and it doesn't work when the type is number.
<div ng-app="myApp" ng-controller="myCtrl as model">
<input type="text" ng-model="cero" ...
0
votes
0answers
8 views
How would I do a unit test in jasmine for $rootScope.$watch for my angular 1 directive
How would I do a unit test for $rootScope.$watch?
$rootScope.$watch("myVariableChange", (event) => scope.myTest= false);
I'm using angular 1 and javascript.
This is my current attempt:
"use ...
1
vote
2answers
16 views
Service method called in directive's controller runs but logs undefined
I've got a directive which is used in some of my templates and handles to upload a file, where I need to inject the relative service which handles the server requests.
Here it is
angular.module("app"...
0
votes
0answers
17 views
Need to create Model for ngAutocomplete
Have a problem with model for ngAutocomplete directive.
<md-input-container flex-gt-sm="40" flex-offset-gt-sm="5">
<label>AutoComplete</label>
<input type="text" id="...
0
votes
2answers
31 views
How to make custom directive with dialog box template using Angular JS?
I need to show a confirmation box on different pages. So i have decided to create a custom directive for performing this task. I have a html template for confirmation box.There are two buttons and ...
3
votes
1answer
237 views
Unable to properly bind data from controller to a custom directive template, Angular
So I have the code for a search bar in its own template, which I have in a custom directive. Then I put that directive in the my Navbar template.
<form class="navbar-form navbar-left" role="search"...
0
votes
0answers
11 views
angular, compile attribute added via directive
Using ES6 and webpack in my angular project, and trying how to compile a dynamically added angular material directive to my input.
My Directive looks like this
class addMaxLength {
...
1
vote
1answer
59 views
Unit Test angularjs directive with watch on element height
I am planning to unit test a angular directive using jasmine. My directive looks like this
angular.module('xyz.directive').directive('sizeListener', function ($scope) {
return {
link: function(...
0
votes
2answers
29 views
set max size for file input in angularjs
I have used html file input to select file for uploading. I have created a angular directive. Now I want to set max allowed file size for input. If file size is greater then allowed size, error should ...
0
votes
0answers
17 views
How to bind the src value to directive scope variable dynamically for each indices of an audio file array
I used a music frequency visualiser using D3.js and the Web Audio API in my AngularJS application.
I created a custom bower component inside that a directive and an templateUrl html file are there.
...
0
votes
0answers
22 views
Addclass dont work with angular directive
<form name="configurationForm" class="form-horizontal config-form" novalidate confirm-on-exit>
I have this code, if I add a class to the input and if I put a different value, the initial, it ...
1
vote
2answers
59 views
Angular 2 - cant navigate to route directly using the URL
I've set up some routing in my angular 2 project. This has never been a problem for me in the past but I'm having difficulty with this newer version of angular.
If I click links to the routes I have ...
0
votes
1answer
16 views
Angular, change model value with checkbox
I have a bound data variable named 'bool' which has a value of 100. When I click a checkbox I'd like the value to increase by adding 50 to it. What am I doing wrong?
<div ng-app="app">
<h3 ...
0
votes
1answer
12 views
Please provide me explanation for the Slider directive
Can anyone please explain the Slider directive provided here
myApp.directive('slider', function() {
return {
restrict: 'A',
scope: {
ngModel: '='
},
...
0
votes
1answer
26 views
Angular Call NGIF inside custom directive
I'm looking to use NGIF inside my own directive as a kind of wrapper.
I found the following example which is working perfectly...
var NAME = 'yourCustomIf';
angular.module('myApp', [])
.directive(...
0
votes
0answers
8 views
Ng-class not working in dynamic $compiled html in directive
I want to compile a template inside my directive. My compilation code looks like this:
app.directive("test", ['web', function (web) {
return {
restrict: 'A',
link: function (scope, ...
2
votes
1answer
1k views
Angular - Directive with controllerAs, bindToController, and $scope.$watch
I have a fairly straightforward AngularJS question to which I cannot seem to find an answer:
How would I go about using $scope.$watch() in a directive controller while also using the controllerAs and ...
2
votes
1answer
2k views
+50
Angular File Upload directive not updating controller model
I am attempting to follow this [tutorial] but can't get it working.
My Angular controller is logging undefined for a model created in my directive.
Here is a [JSFiddle] of it working created my ...
0
votes
1answer
26 views
DyGraph with an independent series
I start to use dygraph and I found some difficulties to work with independant series, specially because I have a voluminous data, is there any solution to work with independent series without ...
0
votes
0answers
16 views
How to apply an attribute in directive decorator?
I'm quite confused why this code doesn't work. Would really appreciate some input.
I have a custom attribute, called myAttribute, that I want to attach to a 3rd party element called my-custom-element ...
1
vote
0answers
12 views
Setting attribute inside Link function AngularJS
I'm wondering what is the best way to set an attribute inside a link function when creating a custom directive. We have 2 options:
1.
function Link(scope, element, attrs, ctrls) {
element[0]....
36
votes
5answers
49k views
Detect unsaved data using angularjs
I'm a newbie to AngularJs, so this might be trivial.
Are there any inbuilt AngularJs directive to detect unsaved data in a form.
If not then how to go about writing one.
Any pointers would be ...
13
votes
4answers
7k views
AngularJs 1.5 - Component does not support Watchers, what is the work around?
I've been upgrading my custom directives to the new component method.I've read that component's does not support watchers. Is this correct? If so how do you detect changes on an object. For a basic ...
0
votes
0answers
18 views
How scope will be applied to a parsed html
When trying to understand "Compiling Trusted HTML" (see the last paragraph in this page) : a list of strings representing html links with ng-click attributes are going to be marked as trusted html ...
3
votes
2answers
28 views
Alternative name for *ngIf directive
A long time ago Angular 2's docs mentioned an alternate name for *ngIf, that didn't use an asterisk. I believe it was something similar to <prefix>-ng-if where <prefix> was some short ...
0
votes
3answers
38 views
Two attribute directives with new/isolated scope on single element
I'd like to use an AngularJS directive to disable specific parts of forms throughout the application based on whether the user has a specific role (given as attribute value; may be different per ...
2
votes
0answers
35 views
Directive cannot bound for component?
Update:
https://plnkr.co/edit/kbz5uimNZ6vKTiT9QB6a?p=preview is created for testing.
I have the following directive egFiles to handle the status of <input type="file" id="newFile" eg-files="model....
3
votes
1answer
724 views
Receiving “Unknown provider: UploadProvider” error using ng-file-upload
I'm attempting to use the ng-file-upload directive (https://github.com/danialfarid/ng-file-upload) to add file-uploading functionality to my project, but keep getting this error:
Error: [$injector:...
0
votes
1answer
56 views
How use controller variable inside a AngularJs directive
How use controller variable inside a directive . I used popoverHtml inside scope in directive but when i add type like this type not work :
like this : scope: { popoverHtml:'@', type: @ },
my html ...
3
votes
1answer
865 views
why list is not display while using collection-repeat instead of ng-repeat
I used ng -repeat in my demo .But due to large data coming from service .I want to use collection-repeat for performance better .how I will use collection-repeat to get the same out put here .here ...
0
votes
1answer
44 views
Angular JS - QuizApp - How to show all questions
I am developing Quiz App,where in currently ,questions are being displayed one after another,which means when first question gets displayed and user selects correct option(multiple options in the form ...
0
votes
0answers
25 views
Angular 1.5. Getting ngModelControllers under ng-if/ng-switch inside a form level directive
I'm building a form level directive which has to access all child ngModelControllers. Using querySelectorAll('[ng-model]') in link phase works fine for all ngModelControllers except for the ones under ...
1
vote
1answer
25 views
How to trigger ng-change on md-select when model is changed?
I'm using md-select and need to trigger certain code when the value changes (building a Country/State selector). I have it working fine when I change the value through the control but I also need to ...
-1
votes
5answers
43 views
What is the diff between using {{…}} and without {{…}} and angular directives?
Actually I'm confused between when to use {{ }} when using angular directives and when to not to use {{ }}
For example:
<div data-ng-init="isHidden=false">
<div data-ng-show="isHidden"...
1
vote
2answers
1k views
Custom directive with dynamic template and binding parent scope to ng-model
I have a view that contains a template specified in a custom directive. The template that is used in the custom directive depends on 'dynamicTemplate':
View:
<div ng-controller="MyController">
...
4
votes
4answers
753 views
Use of symbols '@', '&', '=' and '>' in custom directive's scope binding: AngularJS
I have read a lot about the use of these symbols in the implementation of custom directive in AngularJS but the concept is still not clear. I mean,
what does it mean If I use one of scope value in ...
1
vote
1answer
19 views
Angular 2 problems with directive input / output
I cannot bind variables input / outputs. I don't know what I am doing wrong.
HTML
<p [timeDelta]="'2016-09-20 00:00:00'">{{delta}}</p>
Here is my directive:
import { Directive, ...
0
votes
1answer
26 views
scope undefined in directive
I'm trying to access the value of scope, but it shows it as undefined, and I need to show me the value that the user inserts.
My HTML
<div ng-app="myApp" ng-controller="myCtrl as model">
&...
0
votes
1answer
32 views
AngularJS ng-repeat: Dynamically render/bind canvas inside loop
Relatively new to the world of AngularJS, enjoying it so far.However, I'm struggling with my attempt to loop through entries in my db and render a <canvas> for each one.
Say this is my data (...
-4
votes
0answers
23 views
how online html formatter tools works internallly? [on hold]
I am looking for a way by which i can beautify my ugly html data like online formatter.
suppose i have following html data to beautify:
<html><head></head><body></body>&...
1
vote
1answer
31 views
Difference between Angular2 ReactiveForm vs Model Driven form vs template Driven?
Difference between Angular2 Reactive Form vs Model Driven form vs Template Driven in AngularJs 2 Final Release
And How to Apply Custom Validation on it?
Please give me example if u can.
Thanks.
1
vote
2answers
30 views
ng-if and ng-class-even/odd doesn't work well together and won't get expected outout
Here,I am loading a json file and using ng-repeat I display json data into table form.I am adding following features to code.
checkboxes to add the two CSS:
Bubble CSS
text-danger [In built ...
-1
votes
1answer
22 views
How to inherit functions from a parent component in angular2
I am new to angular2, feel free to help me tune my vocabulary / terminology
I have a class that is composed of two directives like so:
in parent.component.ts, the Parent is made up of Foo and Bar
@...
1
vote
2answers
41 views
angular add property to model
I have an angular service that returns a list of items from the database.
I display those items through an ng-repeat. I'd like to hide/show each one of them using the ng-show.
Is it a good practice ...
