CODEWITHSUNDEEP
javascriptangularjsionic-frameworktoggle
Kangze Huang
Kangze Huang

Reputation: 351

How to get Angular to toggle on a button and toggle off the other?

Really simple objective but i cannot seem to get it to work. I have 2 toggles (using ionic css) that represent 2 modes. Only 1 mode can be on at a time, so when you toggle one on, the other should turn off (visually and in code).

I have binded the toggles with ng-model and an ng-click, but they are not working. This is what the toggles look like:

<input type="checkbox" ng-click='turnOnAC(true)' ng-model='ac'>
<input type="checkbox" ng-click='turnOnFan(true)' ng-model='fan'>

So when turnOnAc(true) is called, it should set $scope.ac = true and $scope.fan = false.

$scope.turnOnAC = function(bool){
    if(bool == true){
    $scope.fan = false;
        $scope.ac = true;
    }
};

It must be something silly I am forgetting, but I am blind to it! Could anyone help me out?

http://jsfiddle.net/dvtofn6L/59/

Upvotes: 1

Views: 655

Answers (2)

Shaishab Roy
Shaishab Roy

Reputation: 16805

you didn't inject $scope in your controller function. so you should inject $scope and the should working fine.

app.controller('NavController', function ($scope) {

and if you don't use this in your controller then you may no need to use controller as

so use 

<div class="nav" ng-controller="NavControlle">

instead of 

<div class="nav" ng-controller="NavController as nav">

Upvotes: 2

Sergio Fandino
Sergio Fandino

Reputation: 445

You're missing the $scope param in your Controller's function:

app.controller('NavController', function ($scope) {...

Upvotes: 2

Related Questions