Exemple simple AngularJS, AJAX et ASP.NET MVC

Je voudrais voir un exemple extrêmement minimaliste d'AngularJS faisant un appel AJAX à une méthode d'action ASP.NET MVC. J'ai essayé de le faire moi-même sans succès. Voici mon code exemple ...Exemple simple AngularJS, AJAX et ASP.NET MVC

La méthode d'action MVC ...

public string Color() 
{ 
    return "red"; 
}

Le code HTML ...

<!DOCTYPE html>  
<html ng-app ="ColorApp"> 
<head> 
    <title>ColorApp</title> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.min.js"></script> 
    <script src="/Scripts/app.js"></script> 
</head> 
<body> 
    <div ng-controller="ColorController"> 
     {{color}} 
    </div> 
</body> 
</html>

Le JavaScript ...

var colorApp = angular.module('ColorApp', []); 

colorApp.controller('ColorController', function ($scope) { 

    $http({ 
     url: '/home/color', 
     method: 'GET' 
    }).success(function (data, status, headers, config) { 
     $scope.color = data; 
    }); 

});

Certaines choses à considérer:

Si je remplace la méthode $http avec quelque chose comme $scope.color = 'purple'; alors ma vue rend le mot "violet" comme prévu.
Si je laisse tout tel quel mais remplace l'AngularJS par jQuery, tout fonctionne comme prévu (je deviens "rouge"). J'ai essayé de changer {{color}} à {{color()}} mais cela n'a fait aucune différence.
J'ai essayé de changer la méthode d'action à un JsonResult et en renvoyant Json("red", JsonRequestBehavior.AllowGet); mais cela n'a fait aucune différence non plus.

J'apprécie votre aide!

Source

2014-07-02 Jason

ajouter $ http à votre contrôleur

colorApp.controller('ColorController', function ($scope,$http) { 
     $http({ 
       url: '/home/color', 
       method: 'GET' 
      }).success(function (data, status, headers, config) { 
    $scope.color = data; 
    }); 
});

Source

2014-07-02 14:37:20 user2351467

Wow! C'est si simple. Merci beaucoup! :) – Jason

Exemple simple AngularJS, AJAX et ASP.NET MVC

Répondre

Questions connexes