I am new in angular. I click a button using ng-click. I send it paramter. Every is ok.
<div class="item item-text-wrap" ng-click="GetRecordPDF({{item.RecordId}})"></div
After this, I need change view and this view's controller will make a service call using "item.RecordId" parameter.
I hope I will explain what I want to do. Maybe, I make a wrong thing about call ing methods in angular.
How can I make this? Thanks in advance.
You no longer need the brackets '{{}}' for variables. You can read more over expressions on this site: https://docs.angularjs.org/guide/expression
Write this now:
<div class="item item-text-wrap" ng-click="GetRecordPDF(item.RecordId)"></div>
Related
I have this piece of HTML:
<div class="item item-icon-left" ion-datetime-picker="" time="" ng-model="timeValue">
<i class="icon ion-ios-clock positive"></i>
<p><strong">{{timeValue | date:'HH:mm'}}</strong></p>
</div>
And in my controller I have this function that will fire when a toggle is activated:
$scope.funCheck = function(check) {
console.log($scope.timeValue);
};
And I use this: https://github.com/katemihalikova/ion-datetime-picker to pick a time and set it.
It works fine to pick the time, however, in the function I'm geting undefined and I dont know why.
I want to get the time I picked and do some stuff in my controller with the $Scope.
You need to be using "dot notation". Because of inheritance, simple values will not do two way binding.
Please use the following code for two way data binding with ionic
use in controller
$scope.dateTime = { timeValue : '' }
and in model ng-model="dateTime.timeValue"
Read more details from here and here.
Hope this well help!
I want to do a two way data-binding from my view to controller. is it possible to do it using ng-model? it displays undefined in the controller though.
My code is something like:
<span ng-model="xyz">${user.group}</span>
and in my controller:
console.log($scope.xyz); //returns undefined.
What is the use of ng-model if I cannot use it this way?
Can anyone suggest a workaround for this?
Your problem is that the ng-model must be bound to an actual value. Spans do not have a value associated to them like inputs do so your $scope.xyz would never be set unless you set it in the scope. Even after that it would not do anything with the span. You also need double {{ and }} around everything, not single {}. You also do not need the $ symbol in the html.
Try :
<input type="text" ng-model="xyz" /> <span> {{xyz}} </span>
Got it working, I was missing to pass the argument to this function as a string, I simply had to do this using ng-bind on span tag like this:
ng-bind="getGp('${user.group}')"
Thanks everyone.
I have tried to do the following:
<accordion-heading ng-click="doSomething(); isopen=!isopen">
Should this work? or is it not possible to string there call together?
ng-click="doThis(param); doThat(param);"
I just need pointed in the right direction :-)
EDIT:
this:
ng-click="doThis(param); doThat(param);"
works as expected, I think it is:
isopen=!isopen
that is causing the problem, I realise I didn't say this initially.
I go around this by adding an extra div into the accordion heading, like this:
<accordion-heading ng-click="isopen=!isopen">
<div ng-click="showMainView()">
<i class="glyphicon" ng-class="{'glyphicon glyphicon-minus': isopen, 'glyphicon glyphicon-plus': !isopen}"></i>
{{item.model}}<br>{{item.model_engine}}
</div>
</accordion-heading>
possible !! possible !! possible !! possible !! possible
You can call multiple functions with ';'
See here
Using ng-click to call two different functions
How to add many functions in ONE ng-click?
How to use ng-click with multiple expressions?
It works:
http://plnkr.co/edit/fwSdBT3NIBrlk80aTgaB?p=preview
However be careful not to do too much logic in there. You should put the logic in the controller and only call it from the view. (isopen = !open for example doesn't belong on the view)
I am trying to do what looks like a simple process: to display a list of items received from an HTTP request with animation.
First of all, here is my way of doing it ( I am open to any suggestions to do it in a better angular way ):
I define a scope variable state that I initialize to loading in my controller and that I change to loaded when I receive data from the HTTP request.
I initialize a scope variable items with the received data.
In my view, I use ng-switch for the states, and ng-repeat with the items.
I define an animation with css on ng-repeat.
Here is a plunkr ( with a $timeout instead of the request ).
I cannot understand why the animation does not work.
Any help will be appreciated. Thanks.
The reason it is happening is because your ng-when. The same thing happens with ng-if, but would work fine if you used ng-show.
The problem is that when your ng-when condition returns true, the ng-when first renders it's content in a detatched dom (so animations do not happen). This dom is then attached to the dom tree (this step is animated but you would have to put your animation class on the ng-when).
When using something like ng-show or ng-hide things work as expected because the dom is always attached (it is simply shown/hidden).
This might be considered either a bug or a limitation of ng-animate, you might want to post a github issue and see if the angular guys have any thoughts.
It seems to be a "feature" of angular that it won't add .ng-enter to repeat items inside ng-switch-when block. You can remove ng-switch-when="loaded" and it will work (You don't really need it as ng-repeat won't do anything if there is no items)
<div ng-switch="state">
<div ng-switch-when="loading">
<p>Please wait...</p>
</div>
<div >
<ul ng-repeat="item in items" class="animate-items">
<li>{{item}}</li>
</ul>
</div>
</div>
http://plnkr.co/edit/ocEj7BSQPSeIdnnfAOIE?p=preview
I would think this is fairly straight forward, but if I try to include a bound {{data}} model as a parameter in ng-click, nothing happens (an no error is fired in Console).
For example, I have the following:
<p ng-repeat='item in array'>
<a ng-click='function({{item}})'></a>
</p>
Here is a plunker that is more fleshed out: plunker
If I click on the link, nothing happens. Ideas?
Found my own answer:
within ng-click, there is no need for the {{notation}}. It knows that "item" is an angular data model. Again, not super clear in the Angular documentation.
Here is the updated plunker that shows it working and not working.