w3hello.com logo
Home PHP C# C++ Android Java Javascript Python IOS SQL HTML videos Categories

Angular auto trigger specific directive in ng-repeat


You could pass the $index (exists automatically in the ng-repeat scope) - variable into the directive and cause it to broadcast an event unique for ($index + 1) which is the $index for the next instance.

The event could be broadcasted from the $rootScope or a closer scope that's above the repeat. Then you could capture the event in there.

Probably not the best way to do it. I can try to elaborate if anything is unclear.

EDIT

So I played around alittle and came up with this: http://plnkr.co/edit/ChRCyF7yQcN580umVfX1?p=preview Rather

Rather than using events or services I went with using a directive controller to act as the parent over all the line directives inside it:

.directive('lineHandler', function () {
    return {
        controller: function () {
            this.lines = [];
        }
    }
 })

Then requiring 'lineHandler' controller inside the 'line' directive - the controller being a singleton (same instance injected into all the line directives) - you can then setup that controller to handle communication between your directives.

I commented most of my code in the updated plnkr and setup an example of what I think you requested when clicking in one list - affecting the one beneath.

I hope this helps and if anything is unclear I will try to elaborate.


Categories : Javascript

Related to : Angular auto trigger specific directive in ng-repeat
angular.js directive: howto call jquery library for ng-repeat item (with item specific attribute)
Ok I see 2 mistakes here 1. $("#countdown" + scope.item_id).coconut(); you never user jquery inside of a directive. you have to do it the angular way $() in angular you writte it angular.element() 2. in your link function you dont need to go for an id, since the element parameter is acctually your $("#countdown" + scope.item_id) so try with angular.element(element) since you are using isol

Categories : Angularjs
trying to use angular-ui-bootstrap radiobutton directive with ng-repeat in an angular project
Try this: <button type="button" class="btn" data-ng-repeat="(key, value) in items" ng-model="radioModel" btn-radio="key">{{key}} ({{value.length}})</button> Notice btn-radio="key", just drop {{}} and ''

Categories : Angularjs
Repeat Angular Directive
$index is not available to your directive code. It is defined in an inner scope only. I think you should create a child directive and pass required data to it, like $index. <div class="box quarter" ng-repeat="nodes in collectordata"> <div collectordata-child="{{$index}}" class="label">{{nodes.Label}} <span>(<a href="#_">History</a>)</span></div>

Categories : Angularjs
Angular directive not being re-called with ng-repeat
The data is not refreshing because in your ngRepeat expression, you specify track by $index. When currentItem is updated, the indices of objects in your steps array remain the same even if the actual objects are different. Therefore angular does not update the repeater because the $index has not changed and we are tracking the step objects by this $index variable. Remove the track by part of the

Categories : Javascript
Angular directive not working with ng-repeat
I ran your code in Plunker http://plnkr.co/edit/Vh4KxPxJyEsaOPrK38sV?p=preview and I didn't see any issue except that you need to set value="{{data.text}}" instead of value="data.text" I added a span an a label to make the first directive look like the second one.

Categories : Angularjs


© Copyright 2017 w3hello.com Publishing Limited. All rights reserved.