簡單AngularJS，AJAX和ASP.NET MVC示例

我希望看到一個非常簡約的AngularJS示例，它將對ASP.NET MVC操作方法進行AJAX調用。我試圖自己做這件事，但沒有成功。這裏是我的示例代碼...簡單AngularJS，AJAX和ASP.NET MVC示例

的MVC操作方法......

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

的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>

中的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; 
    }); 

});

有些事情要考慮：

如果我用之類的東西替換$http方法，那麼我的視圖按預期呈現單詞「purple」。
如果我保留原樣，但用jQuery替換AngularJS，一切都按預期工作（我得到「紅色」）。
我試着改變{{color}}到{{color()}}但它沒有區別。
我嘗試將操作方法更改爲JsonResult並返回Json("red", JsonRequestBehavior.AllowGet);但這也沒有區別。

我很感謝您的幫助！

來源

2014-07-02 Jason

添加$ HTTP到控制器

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

來源

2014-07-02 14:37:20 user2351467

哇！就這麼簡單。萬分感謝！ :) – Jason

簡單AngularJS，AJAX和ASP.NET MVC示例

回答

相關問題