I had this problem when calling a function from ng-click using $scope.var as parameter.
For instance:
Not Working:
<div ng-repeat="value in values track by $index">
<a ng-click="function({{ value }})">{{ value }}</a>
</div>
Working:
<div ng-repeat="value in values track by $index">
<a ng-click="function(value)">{{ value }}</a>
</div>
Why we can't use {{ }} if the variable is from $scope, declared on an Angular controller? Is there others situations when I will not use it?
We can not use expressions in directives like ng-click.
Expression can access variables and functions from the scope.
while using it in function, there is no need to write expression
First thing function is in built keyword.You can not use it.
suppose in controller you defined function like this.
$scope.callMe = function(){
}
then define the html :
<div ng-repeat="value in values track by $index">
<a ng-click="callMe(value)">{{ value }}</a>
</div>
Related
Hey I have array of numbers, I am writing them using ng-repeat. When you click on some number should be pass to function passParameterToService parameter index and should be saved in service to variable this.whichBoard. But I have do something wrong, can someone tell me why ng-repeat don't work when I add service and why after click on some number, it's dont write to a variable?
demo
https://codepen.io/Turqus/pen/WXEryN
In your service you were declaring this.whichBoard but inside the function you again used the same named variable. If you set this.board inside, it would probably work:
app.service('serwis', ()=> {
this.whichBoard = (index) => {
this.board = index;
};
});
Also in the calling method, you have:
<a href="#" ng-click="passParameterToService($index)">
<span ng-repeat="item in arrayIndex">{{item}}</span>
</a>
You're passing $index, which isn't a value. Also, you have the repeat inside the method call, so change it to:
<div ng-repeat="item in arrayIndex track by $index">
{{item}}
</div>
how do I keep this function from firing/incrementing every single div generated? I only want it to upvote the specific one that I click on. I think the problem is that is inside the ng-repeat.
<div class="text-center" ng-repeat="value in unique">
<span ng-click="incrementUpvotes()">
{{value[0]}} and {{value[1]}} for {{value[2]}} and {{value[3]}} upvotes: {{upvotes}}
</span>
</div>
What I would do is have the function in your controller handle the incrementing of the upvotes, not the actual DOM. Then you can pass in which value you want to be incremented through that function. For example your controller could look like:
function incrementUpvotes(valueNumber){
$scope.value[valueNumber]++;
}
and your HTML like:
<div class="text-center" ng-repeat="value in unique">
<span ng-click="incrementUpvotes(value)">{{value[0]}} and {{value[1]}} for {{value[2]}} and {{value[3]}} upvotes: {{upvotes}}</span>
</div>
This does not seem possible, but is it:
<div ng-repeat="item in myitems | {{ searchfilter }}">
<span>{{ item.title }}</span>
</div>
or some variant of it? All I get are no results.
searchfilter should not have {{ }} around it. Since this is a directive, angular knows how to deal with the variable. You only need the braces when trying to inject a variable from angular scope into the non-angular HTML.
You should correct syntax to this instead:
<div ng-repeat="item in myitems | filter:searchfilter">
With Search filter Moustaches :<span>{{ item.title }}</span>
</div>
Have created a small plunk for reference.
http://plnkr.co/edit/tpl:rfqcl9AHEoJZEEJxyNn2?p=preview
How to append expression variable on ng-repeat in Angularjs
My code:
<div class="col-md-9" ng-controller="AddOrderController">
<div class="owl-demo" class="owl-carousel" ng-repeat="t in [1,2]">
<div class="item" ng-repeat="d in datas.item{{t}}" >
<imagedata value="d"></imagedata>
</div>
</div>
</div>
Error this line: ng-repeat="d in datas.item{{t}}"
i have data.items1, data.item2 json data
how to declare datas.item{{t}} ?
you can't use an expression in this case, but you don't need to because the t variable is already available to you. just use ng-repeat="d in datas['item' + t]"
If this ng-repeat is throwing Duplicate Key in Repeater, you may have to modify it slightly to be ng-repeat="d in datas['item' + t] track by $index"
How about ng-repeat="d in datas['item'+t]"?
I have a lot of data within ng-repeat. It looks like table with many rows and columns. I want to put ng-click directive on some of cell of table.
Can i put some condition before ng-click directive? If this condition is true - I want to put the directive, otherwise - not to put.
I think you should just put the directive in there and pass it a condition as a parameter which returns boolean. In the directive compile function check if your parameter is right and decide from there what you load.
Maybe this is what you were looking for?
<ul class="menuItems">
<li ng-repeat="item in menuItems">
<div ng-if="item.type == 'link' ">
{{item.name}}
</div>
<div ng-if="item.type == 'function' ">
<span ng-click="function(item.command)" title="item.description">{{item.name}}</span>
</div>
</li>
</ul>