Question

我熟悉angular.js，使用$Http.Get从文件返回Json数据似乎很容易。

在一个例子中，我会得到像我这样的json数据

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

    artistControllers.controller('ListController', function ($scope, $http) {
    $http.get('json/jsonAngular.txt').success(function (data) {
    $scope.artists = data;
  });
});

我如何获得JsonResult并将其分配给我的$ scope.artists。

    [HttpPost]
    public JsonResult GetArtists()
    {
        ViewModel model = new ViewModel();
        model.GetArtists();
        return Json(new
        {
            Artists = model.Artists
        });
    }

我的课程看起来像这样的例子

 public class Artist
{
    public string Initial { get; set; }
    public string Surname { get; set; }
}

是否有一个可以返回JsonResult并在我的html中呈现它的工作示例。

Answer 1

就像：

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

artistsApp.controller('ListController', function ($scope, $http) {
    $http.get('api/getartists').success(function (data) {
         $scope.artists = data.artists;
    });
});

<ul>
  <li ng-repeat="artist in artists">{{ artist.Surname }}</li>
</ul>

如果json / jsonAngular.txt返回你的json，那么你的代码的其余部分就是代码。你可以像上面的ng-repeat那样简单地访问它。

另请记住，您需要将视图与控制器关联。这通常在app.js配置部分内完成。

$routeProvider
            .when('/', {
                controller: 'artistControllers',
                templateUrl: 'artists.html'
            })

注意：最佳做法是将控制器中的数据访问抽象为服务，以便您可以重复使用数据访问调用。

Answer 2

而不是$scope.artists = data;，而不是$scope.artists = data.artists;

用Angular.js显示JsonResult

2 个答案: