Warum wird ein in ein $ scope-Feld geändertes Feld nicht in ein anderes Feld übertragen?

Question

Ich habe eine Direktive, die ein Array akzeptiert. Es ist zunächst undefiniert und wird dann zu einem bestimmten Zeitpunkt asynchron definiert.

Die Richtlinie sieht ähnlich aus wie

function XYZDirective() { 
    return { 
     restrict: 'EA', 
     replace: true, 
     scope: { 
      array: '=' 
     }, 
     controller: ['$scope', $scope => { 
      $scope.$watch(() => $scope.array, (newValue, oldValue) => { 
       $scope.firstElement = (newValue && newValue.length > 0) 
        ? newValue[0] 
        : null; 
      }); 

     }], 

     templateUrl: URL 
    }; 
} 

Dies funktioniert gut. Ich wollte dann für die $watch loswerden und einfache Bindung verwenden.

function XYZDirective() { 
    return { 
     restrict: 'EA', 
     replace: true, 
     scope: { 
      array: '=' 
     }, 
     controller: ['$scope', $scope => { 

      $scope.getFirstElement = function() { 
       return ($scope.array && $scope.array.length > 0) ? $scope.array[0] : null; 
      } 

      $scope.firstElement = $scope.getFirstElement(); 
     }], 

     templateUrl: URL 
    }; 
} 

Ich würde erwarten, $scope.firstElement zu bekommen jedes Mal $scope.array Änderungen neu bewertet.

Dies funktioniert jedoch nicht. Wenn ich einen Beobachter auf $scope.array hinzufügen kann ich sehen, es aktualisiert wird, aber die Änderung propagiert nicht zu $scope.firstElement

Answer 1

Dies ist eine Aussage, die genau einmal ausgeführt wird

$scope.firstElement = $scope.getFirstElement(); 

Und dann nie wieder (nur wenn Richtlinie/Controller zerstört, ein wieder gerendert)

Also, sollten Sie die Methode

{{getFirstElement()}} 

werden beobachtet

und das wird wirklich diese Überprüfung wieder und wieder auslösen ... und ... wieder .. so vielleicht $watch ist der bessere Weg zu gehen (z.B. beobachten, bis zuerst Array kommt, und dann entfernen Sie die Uhr)