And I have the following links in my page as following :
<li ng-repeat="o in villes | shuffle | limitTo:5">{{o.nomVille}}</li>
I want when I click on some link to call the searchByVille function and to log the parameter I passed to it as following :
$scope.search = function(id){
console.log(id);
}
which doesn't work.
How can I solve this ?
Omit the {{}} in your ngClick directive:
ng-click="searchByVille(o.codeVille)"
ngClick already takes an Angular expression - no need for them.
No need to evaluate using {{}}.
Use data-ng-click="searchByVille(o.codeVille)"
Related
i have used angular-translate, and it works great.
But now the problem is how can i use it in my controller functions?
normal we can use it in the html templates as {{ 'mystring' | translate }}
but i actualy want to do this:
function bla(){
var myvalue = 'mystring' | tranlate
return value;
}
and then in my html {{ value }}
As per Docs,to use filter inside controller is as follows.
$filter('filter')(array, expression, comparator)
You need to write something below
app.controller('MainCtr', ['$scope','$translate','$filter', function ($scope,$translate,$filter) {
$translate.use($scope.language.langCode);
$scope.data = $filter('translate')('Title');//where Title is language dependant
});]);
Demo to call filter inside controller
It seems you are trying to show dinamic content on your html. To achieve this you should think in other way to do it using angular-translate. I can guess you are trying to achieve this:
controller.js
$scope.mystring = 'MY_LITERAL_CODE';
inde.html
<span>{{ mystring | translate }}</span>
I am calling an ng-click scrollTo function and passing dynamic id to it, but the id is not rendered and the function gets called.
HTML:
<a data-ng-click="scrollTo('div{{+$index}}')" href="javascript:void(0)">Click</a>
Script:
$scope.scrollTo=function(divId){
console.log(divId);
}
I get div{{+$index}} in console instead of div0
Probably easier to clean this up and just pass the $index - then format the ID in the controller:
<a data-ng-click="scrollTo($index)" href="javascript:void(0)">Click</a>
$scope.scrollTo=function(index){
var divId = "div" + index;
console.log(divId);
}
It should be like this: data-ng-click="scrollTo({{('div'+$index) | json }})"
I'm trying to pass two parameters via view > controller 1 > $route > controller 2.
from view 1:
<td>{{row.NetworkOrgFullName}}</td>
from controller 1:
$scope.getGroups = function (acnId, orgId) {
$location.path('/Groups/' + acnId +'/'+ orgId);
}
from my routeProvider:
$routeProvider.when('/Groups/:acnId/:orgId', {
templateUrl: 'Pages/acn/partials/groups.html',
controller: 'groupsController'
});
On my controller 2:
console.log($routeParams.acnId , $routeParams.orgId)
My results in Console.Log are: [object Object] 164
I can do this with a single param and I actually pass the id I want to pass.
What am I doing wrong?
Thanks in advance!
Your ng-class should be using {{}} interpolation directive, I don't understand why you used ng-class
ng-class="getGroups(row.acnOrgId, row.NetworkOrgID)"
You redirecting purpose you could use anchor ng-href to create an href link.
<td>
<a ng-href="/Groups/{{row.acnOrgId+'/'+row.NetworkOrgID}}">{{row.NetworkOrgFullName}}</a>
</td>
Apparently there are problems with the link tag and the use of service $ location.
There are two possible ways to switch from view 1 to 2:
by using ng-href: <a ng-href="/Groups/{{row.acnOrgId}}/{{row.NetworkOrgID}}">{{row.NetworkOrgFullName}}</a>
by using ng-click: {{row.NetworkOrgFullName}}
About getGroups function. Consider that $location.path change the router to the URL passed as a parameter.
I am developing a mobile application and found that angularjs 1.1.4 has a ngTap directive available replacing standard ng-click. It makes app more robust, so I've decided to replace all my ng-href directive with ng-tap. For this purpose I've created a "go()" function available from $rootScope. The problem is that it can not resolve the url variable.
Here's my code.
$rootScope.go = function (url) {
$location.path(url);
}
and in template:
<a class="niceButtonLikeStyled" data-ng-click="go(/somewhere/var.id/)">{{ var.id }}</a>
Using data-ng-click as ngTap is portable and replaces ng-click if new ngMobile loaded.
My problem seems to be with go() argument (mixing static & variable content ?
Maybe there's the other way of just binding new ng-click to all links.. or simply adding own directive that would take value from ng-href and made the location redirect and attach the ng-tap click event.
AngularJS Expressions for ng-click
When you use ng-click, you're calling an AngularJS expression.
Your current code's expression is this:
go(/somewhere/var.id/)
You need to quote that string:
go('/somewhere/' + var.id + '/')
Other Issues
Another issue with your code: The function go should be in the scope of the controller rather than in the $rootScope:
angular.module('MyModule').controller(
'MyController',
function ($scope, $location) {
$scope.go = function (url) {
$location.path(url);
}
}
);
Here's how your template would look:
<div ng-controller="MyController as mycontroller">
<a class="niceButtonLikeStyled"
data-ng-click="mycontroller.go('/somewhere/' + var.id + '/')">
{{ var.id }}
</a>
</div>
That's the biggest issue with the code, you're using $rootScope instead of putting the variables and functions you need in the scope of a controller where it belongs.
I'm using AngularJS and it's great.
I can't find it in the Documentation - What is the equivalent in Javascript to this AngularJS expression:
<div>{{ (myList| filter:mySearch).length }}</div>
Thanks for the help.
It's on Angular's filter documentation:
In HTML Template Binding
{{ filter_expression | filter:expression }}
In JavaScript
$filter('filter')(array, expression)
In your case, it would look something like $filter('filter')(myList, mySearch).
As an alternative syntax you can also inject a filter directly, without going through the $filter service. For example to inject filter filter to your controller you could write:
MyCtrl = function($scope, filterFilter) {
$scope.filtered = filterFilter(myArray, expression);
}
A question very similar to How to use a filter in a controller?
In your html
<input ng-model="search">
<div ng-repeat="thing in things | filter:searchResults"></div>
In your JS
$scope.$watch('search', function (newValue, oldValue) {
var searchResults = filterFilter($scope.things, $scope.search);
});