<button class="footer-bar-item item-right button button-clear" ng-hide="taskDetails.task_id == '2044'">
<button class="button" ng-click="addNote(taskDetails.task_id)">Add Note</button>
</button>
taskDetails.task_id value is String and its value is equal to "2044".But button not hides.I'm new to Ionic.I'll grateful if someone can help me to resolve this.
Based on your code snippet, those quotation marks aren't parsable.
Change
ng-hide=”taskDetails.task_id == '2044'”
to
ng-hide="taskDetails.task_id == '2044'"
finally I found solution.
<button class="footer-bar-item item-right button button-clear" >
<button ng-hide="taskDetails.task_id == '2044'" class="button" ng-click="addNote(taskDetails.task_id)">Add Note {{taskDetails.task_id == '2044'}}</button>
</button>
Related
I want to hide the button if it's the delete folder and show if it's the inbox. The code below does not work as the button is always shown.
<div class="message-footer-height" >
<div class="custom-div-class" ng-click="" >
<button class="custom-btn-default"
ng-hide="messageState.details && itemTappedValue = 'delete'"
ng-class="{ 'msg-btn' : userMessageDetails.id === -1 }"
ng-click="deleteMessage()" >
{{"button.delete"|translate}}
</button>
</div>
</div>
Thanks
You need to use ==, == is loose equality and === is strict equality. Read more here https://developer.mozilla.org/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness
<div class="message-footer-height" >
<div class="custom-div-class" ng-click="">
<button class="custom-btn-default"
ng-hide="messageState.details && itemTappedValue == 'delete'"
ng-class="{ 'msg-btn' : userMessageDetails.id === -1 }"
ng-click="deleteMessage()">
{{"button.delete"|translate}}
</button>
</div>
</div>
You need double equal sign here itemTappedValue = 'delete'
I am trying to implement "control group" in Ionic,
Below is my expectation:
But I couldn't find any in Ionic,
this is the link I refer to:
http://ionicframework.com/docs/components/#header
Any suggestion ?
i dont think Ionic has that implemented at the moment the only suggestion i could make would be to either use toggle (bad way) or to use to different buttons I used this way when i created 2 Listcontainers to switch between them
<div class="button-bar">
<a class="button" ng-init="showme=true; setshowme(true)" ng-click="showme=true; setshowme(true)" ng-class="{'active': showme == true}">{{::lang.pnlPosOffenML}}</a>
<a class="button" ng-click="showme=false; setshowme(false)" ng-class="{'active': showme == false}">{{::lang.pnlPosErledigtML}}</a>
</div>
This is what i came up with
Hi This is worked for me, In your html file write the code as
<ion-item>
<button class="button button-light" ng-disabled="!allow" ng-click="selectedMale()">Male</button>
<button class="button button-light" ng-disabled="!notAllow" ng-click="selectedFemale()">Female</button>
</ion-item>
<ion-item>
<button class="button button-light" ng-disabled="!notAllow" ng-click="selectedFemale()">Male</button>
<button class="button button-light" ng-disabled="!allow" ng-click="selectedMale()">Female</button>
</ion-item>
and in your controller the code is
$scope.allow = true;
$scope.notAllow = true;
$scope.selectedMale = function(){
$scope.notAllow = false;
}
$scope.selectedFemale = function(){
$scope.allow=false;
}
please reply if having any queries
I have the value {{data[0].pageCount}}.
It displays a number and it works fine.
But it doesn't work when I do:
<button class='btn button-next' ng-disabled="currentPage >= {{data[0].pageCount}}" ng-click="getPage(currentPage=currentPage+1)">
Any idea how to fix that?
Thanks!
try this,
<button class='btn button-next' ng-disabled="currentPage >= data[0].pageCount" ng-click="getPage(currentPage=currentPage+1)">
Is there a simple declarative way (without a additional function in the $scope) to marked clicked element with AngularJS?
e.g. I have a button which I want to marked as clicked/checked.
<button ng-model="form.btn" ng-click=" // do stuff here to add a class or attr ">Go</button>
I was able to achieve this with external function but I am looking for a declarative way / all in HTML template.
If you want toggle class use this: http://jsbin.com/vimero/1/edit
<button ng-model="btn" ng-click="btn =! btn" ng-class="{'active' : btn}">
Toogle
</button>
<button ng-model="form.btn" ng-click="form.btn = true"
ng-class="{'active' : form.btn}">
Go
</button>
ng-click="yourFunction($event.target)"
And do your transformations in yourFunction. You'll have HTMLElement passed as 1st param.
I found this works pretty well for a group of buttons to toggle active ng-class if the condition set in ng-click is met:
<button ng-class="{'active' : activeButton == 'firstButton'} ng-click="activeButton = 'firstButton'>
First Button
</button>
<button ng-class="{'active' : activeButton == 'secondButton'} ng-click="activeButton = 'secondButton'>
Second Button
</button>
<button ng-class="{'active' : activeButton == 'thirdButton'} ng-click="activeButton = 'thirdButton'>
Third Button
</button>
I need to pass button id in Ionic Framework.
Here is what I have tried.
In js code:
angular.module('todo', ['ionic'])
.controller('TodoCtrl', function($scope) {
{
$scope.showAlert = function(btnId) {
alert(btnId);
};
}
});
In html:
<button id="a" class="button button-light" data="{{button.id}}" ng-click="showAlert(data.id)">
Click Me
</button>
O/P: undefined
or
<button id="a" class="button button-light" data="{{button.id}}" ng-click="showAlert(data)">
Click Me
</button>
O/P: undefined
or
<button id="a" class="button button-light" data="{{event.id}}" ng-click="showAlert(data.id)">
Click Me
</button>
O/P: undefined
or
<button id="a" class="button button-light" ng-click="showAlert(this.id)">
Click Me
</button>
O/P: undefined
or
<button id="btnId" class="button button-light" ng-click="showAlert('btnId')">
Click Me
</button>
O/P: btnId
Is this correct way to directly write id of button in function?
I referred to a few answers like this. So I think I am making some mistake in using it. Please let me know what I need to change.
Yo, check this gist:
https://gist.github.com/lc-nyovchev/ed0a640a82a0f2dfd5a1
That is a very easy and naive way to do it.
<div data-ng-init="btnId='asd';">
<button data-ng-attr-id="btnId" class="button button-light" data-ng-click="showAlert(btnId)">
Click Me
</button>
</div>
Or you can have in your controller:
$scope.btnId = 'asd';
Then you don't need the ng-init block div.
Or you can get a handle to the $event in your ng-click, and get its target, and then get its id, but I wouldn't recommend that, it is not the angular way of doing things:
<button id="bla" class="button button-light" data-ng-click="showAlert($event)">
Click Me
</button>
$scope.showAlert = function(event){
alert(event.target.id);
}
This works if no repeaters are there , if repeaters are the data attribute should have different names and secondly event.CurrentTarget.Id will make it work.