CODEWITHSUNDEEP
javascriptangularjsarraysangularjs-scope
user3637771
user3637771

Reputation: 25

AngularJS- Items within ng-repeat not updating on variable update

I have an array called altSegments, and based on $scope.firstSeg or $scope.lastSeg I'd like to display different parts of that same array. In most cases I change the altSegments array alltogether and it updates fine, but when I go from the same altSegments array to the same array but change the $scope.firstSeg and $scope.lastSeg it doesn't update properly.

I suspect it has something to do with altSegments not having changed and therefore AngularJS deciding that it's not worth it to go over the code again and re-display. How would I get around this?

<li ng-repeat="altseg in altSegments">
  <!-- For multiflight home to first -->
  <div ng-show="{{firstSeg}}" ng-repeat="flights in altseg.segment_details_1.leg_details">
    <p class="small dark">
      <strong>Flight:</strong> {{flights.Carrier}} {{ flights.FlightNumber}}
    </p>
    <p class="small dark">
      <strong>Departure:</strong> {{flights.OriginName}} | {{flights.DepartureTime | splitDT }}
    </p>
    <p class="small dark">
      <strong>Arrival:</strong> {{flights.DestinationName}} | {{flights.ArrivalTime | splitDT }}
    </p>
  </div>
  <!-- For multiflight last to home -->
  <div ng-show="{{lastSeg}}" ng-repeat="flights in altseg.segment_details_2.leg_details">
    <p class="small dark">
      <strong>Flight:</strong> {{flights.Carrier}} {{ flights.FlightNumber}}
    </p>
    <p class="small dark">
      <strong>Departure:</strong> {{flights.OriginName}} | {{flights.DepartureTime | splitDT }}
    </p>
    <p class="small dark">
      <strong>Arrival:</strong> {{flights.DestinationName}} | {{flights.ArrivalTime | splitDT }}
    </p>
  </div>

Upvotes: 0

Views: 177

Answers (2)

Partha Roy
Partha Roy

Reputation: 1621

it looks like you are using ng-show="{{firstSeg}}" this should be ng-show="firstSeg" ..

If still doesn't work, Try to update the data from controller side in $scope.apply() ...

e.g :- 

$scope.apply(function(){
  list = updated_list;    // put your updation of list here 
});

Upvotes: 0

aorfevre
aorfevre

Reputation: 5064

ng-show is an angular directive and evaluates angular code;

Therefore; you do not need : ng-show="{{firstSeg}}"

Remplace with : ng-show="firstSeg"

See full documentation of ng-show here: https://docs.angularjs.org/api/ng/directive/ngShow

Upvotes: 1

Related Questions