AngularJS promettent

Question

AngularJS docs say:

promesses q $ sont reconnus par le moteur de templating dans angulaire, ce qui signifie que dans les modèles que vous pouvez traiter les promesses attachées à un champ d'application comme si elles étaient les valeurs qui en résultent.

Donc, quelqu'un pourrait expliquer s'il vous plaît la raison pour laquelle cette fiddle ne fonctionne pas? Il n'est pas possible de changer la valeur du champ de texte. Mais l'attribution de promesses que le service $ $ renvoie à un champ d'étendue fonctionne comme un charme.

Controller:

function MyController($scope, $q, $timeout) { 
    this.getItem = function() { 
     var deferred = $q.defer(); 
     deferred.resolve({ 
      title: 'Some title' 
     }); 
     return deferred.promise; 
    }; 

    $scope.item = this.getItem(); 
} 

Html:

<input type="text" ng-model="item.title"> 

Answer 1

Vous devez utiliser la fonction puis() sur l'objet de promesse:

this.getItem().then(function(result) { 
    $scope.item = result; 
}); 

Dans votre cas Je ne pense pas que vous ayez besoin d'un pro mise Le système de surveillance d'Angular prendra soin de tout. Just return an object in your function, not a primitive type:

this.getItem = function() { 
    var item = {}; 

    // do some async stuff 
    $http.get(...).success(function(result) { 
     item.title = result; 
    }); 
    return item; 
}; 

$scope.item = this.getItem(); 

Answer 2

Je crois que la raison pour laquelle votre premier violon ne fonctionne pas parce que vous liez essentiellement la propriété de portée item à une promesse. Lorsque vous essayez de modifier la valeur en tapant dans le champ de texte, angular remarque l'activité, puis réaffecte/réinitialise la valeur de item au résultat de la promesse (qui n'a pas changé).

La solution fournie par @asgoth définit/affecte la valeur item une fois, lorsque la promesse est résolue. Il n'y a pas de liaison en cours ici (c'est-à-dire que item n'est pas liée à la promesse), donc modifier la valeur via la zone de texte modifie la valeur.

Answer 3

C'est comme @Mark dit, ici vous pouvez trouver un Working Example de votre extrait.

Fondamentalement, vous retourniez un objet et ne liez pas le modèle lui-même.

$timeout(function(){ 
    $scope.item = { 
     title: 'Some title' 
    }; // Apply the binding 
    deferred.resolve(); // Resolve promise 
},2000); // wait 2 secs