angular array item nicht aktualisiert am Umfang Änderung

Question

Verbrachten ein paar Stunden auf diese bereits, gesiebt durch zahlreiche Stack-Beiträge und Blogs, aber kann nicht scheinen, dies zu meinem Modell Update zu machen. Genauer gesagt versuche ich ein Array-Element zu aktualisieren (ng-repeat). In dem einfachen Fall unten, ich Iterate über Veranstaltungsorte Liste, und beim Umschalten eines "Gefällt mir" -Button, ich den Server entsprechend aktualisieren, und spiegeln Sie die Änderung der Veranstaltungsorte Artikel auf dem $ Scope.

in meinem search.html Ich habe eine Richtlinie:

<ion-content> 
    <venues-list venues="venues"></venues-list> 
</ion-content> 

und Suchsteuerung ich habe:

app.controller('bleh', function(Service) { 
    ... 
    $scope.venues = [{ id: 1, name: 'Venue1', like: false },{ id: 2, name: 'Venue2', like: false }]; 
    ... 
}); 

Nichts dort ungewöhnlich. Dann in meiner Locations-Liste Richtlinie:

app.directive('venues-list', function() { 

    function venueListController($scope, Service) { 

     $scope.likeToggle = function(venue, $index) { 
      Service.likeVenue(venue.id, !venue.like).then(function() { 
       $scope.venues[$index].like= !venue.like; 
      }); 
     } 
    } 

    return { 
     strict: 'E', 
     templateUrl: 'venue.html', 
     controller: venueListController, 
     scope: { 
     venues: '=' 
     } 
    } 
}); 

dann in meinem venue.html ich habe:

<div ng-repeat="venue in venues"> 
    <p>{{venue.name}}</p> 
    <button ng-click="likeToggle(venue, $index)">Like</button> 
</div> 

habe ich versucht, viele verschiedene Möglichkeiten:

$scope.$apply() // after updating the $scope or updating scope within apply's callback function; 
$scope.$digest() 
$timeout(function() { // $scope.venues[$index] .... }, 0); 
safe(s,f){(s.$$phase||s.$root.$$phase)?f():s.$apply(f);} 

so

safe($scope, function() { $scope.venues[$index].like = !venue.like }); 

Ich habe den Link innerhalb der Direktive noch nicht benutzt, aber meine locations.html Vorlage ist offensichtlich etwas komplizierter als hier dargestellt.

EDIT:

einfach die Diskussion relevant zu halten, vielleicht sollte ich erwähnt habe - die Daten kommt ohne Probleme vom Server zurück, ich Fehler am Umgang mit und ich bin auf jeden Fall den Teil des Schla Code, in dem der $ scope aktualisiert werden soll. Hinweis: Der obige Code ist eine kleine Darstellung der vollständigen App, aber alle grundlegenden Teile sind oben artikuliert.

1. Search-Controller
2. Locations Dienst
3. Ort-Liste Richtlinie und venue.html Vorlage der Richtlinie
4. Richtlinie Controller

EDIT # 2

$scope.foo = function() { 
    $scope.venues[0].like = !$scope.venues[0].like; 
} 

begleiten

einfach zu halten es noch einfacher, ist die oben nicht funktioniert - so wirklich, ist unter dem Strich, meine Einzelteile innerhalb eines Arrays werden die Updates nicht reflektierenden ...

EDIT # 3

$scope.foo = function() { 
    $scope.venues[0].like = !$scope.venues[0].like; 
} 

Ich entschuldige mich - nur um zu wiederholen, was ich oben sagen wollte - das obige ändert den Umfang, aber die Änderungen werden nicht in der Ansicht wiedergegeben.

Answer 1

Vielleicht ist das Problem mit Ihrem Service und Versprechen Auflösung .. Können Sie eine Konsole setzen.Loggen Sie sich dort ein und sehen Sie, ob die versprochene Auflösung gut funktioniert? Oder können Sie diesen Code teilen? Wo suchen Sie auch nach Scope Update? innerhalb der Richtlinie oder außerhalb

Answer 2

OK nach einigen Refactoring habe ich endlich funktioniert.

Die „repariert“ zu meinem speziellen Problem (wenn man es so nennen will) war:

stattdessen eine Reihe von Orten von vorbei, ich war auf der übergeordneten Steuerung über das Array iterieren, in einem Ort vorbei als ein Elementattribut, das an den isolierten Geltungsbereich der Richtlinie (in zwei Richtungen) binden würde.

so statt:

<ion-content> 
    <venues-list venues="venues"></venues-list> 
</ion-content> 

Ich habe jetzt:

<ion-content> 
    <venues-list ng-repeat="venue in venues" venue="venue"></venues-list> 
</ion-content> 

und meine Richtlinie nun wie folgt aussieht:

app.directive('venues-list', function() { 

    function venueController($scope, Service) { 

     $scope.likeToggle = function(venue) { 
      Service.likeVenue(venue.id, !venue.like).then(function() { 
       $scope.venue.like = !venue.like; 
      }); 
     } 
    } 

    return { 
     strict: 'E', 
     templateUrl: 'venue.html', 
     controller: venueController, 
     scope: { 
     venue: '=' 
     } 
    } 
}); 

Dies hat den Trick!