javascript - AngularJS - Conditionally hide a span -


i want hide <span ng-show="currencyobject.to != 'undefined'">=</span> until currencyobject.to undefined supposed undefined until user select option select box.
used ng-show="currencyobject.to != 'undefined'" conditionally show-hide span not working. find is, when page freshly loaded, = visible.

 <div class="row" ng-controller="qconvertcontroller">   <div class="col-md-8 col-md-offset-2">     <div class="form-group">       <label for="amount">amount</label>       <input type="number" step="any" class="form-control" id="amount" ng-model="currencyobject.amount">     </div>   </div>     <div class="col-md-8 col-md-offset-2">         <div class="form-group">          <label for="from">from</label>           <select class="form-control" id="from" ng-model="currencyobject.from" ng-change="getconvertedrate()">             <option ng-repeat="currencycode in currencycodes" value="{{currencycode.value}}">{{currencycode.display}}</option>           </select>         </div>     </div>      <div class="col-md-8 col-md-offset-2">         <div class="form-group">          <label for="to">to</label>           <select class="form-control" id="to" ng-model="currencyobject.to" ng-change="getconvertedrate()">             <option ng-repeat="currencycode in currencycodes" value="{{currencycode.value}}">{{currencycode.display}}</option>           </select>         </div>     </div>      <br>     <br>     <br>     <div class="col-md-8 col-md-offset-2">         <h1 class="display-4">{{currencyobject.amount}} {{currencyobject.from}} <span ng-show="currencyobject.to != 'undefined'">=</span> {{currencyobject.amount_converted}} {{currencyobject.to}}</h1>     </div> </div> 



qconvertcontroller.js

var app = angular.module('qconvertctrlmodule', []) .controller('qconvertcontroller', function($scope, $http, $log) {      $scope.currencyobject = {};      $scope.currencyobject.from;      $scope.currencyobject.to;      $scope.currencyobject.amount;      $scope.currencyobject.amount_converted;      $scope.currencyobject.runcount = 0;      $scope.currencycodes = [{value : 'inr', display : 'indian rupee'}, {value : 'usd', display : 'us dollar'}, {value : 'gbp', display : 'british pound'}];      $scope.getconvertedrate = function() {          $log.info("from : " + $scope.currencyobject.from);          $log.info("to : " + $scope.currencyobject.to);          $http.get("http://api.decoded.cf/currency.php", {params : {from : $scope.currencyobject.from,             : $scope.currencyobject.to, amount : $scope.currencyobject.amount}})             .then(function(response) {                  $scope.currencyobject.amount_converted = response.data.amount_converted;                 $log.info(response.data.amount_converted);               });      };  }); 

you don't need != 'undefined' check variable defined or not

<span ng-show="currencyobject.to">=</span>  

or

<span ng-hide="!currencyobject.to">=</span>  

or

<span ng-if="currencyobject.to">=</span>  

Comments

Popular posts from this blog

Spring Boot + JPA + Hibernate: Unable to locate persister -

go - Golang: panic: runtime error: invalid memory address or nil pointer dereference using bufio.Scanner -

c - double free or corruption (fasttop) -