Web Api的Angular资源设置2

Angular Resource Setup for Web Api 2

本文关键字:设置 资源 Angular Api Web      更新时间:2023-09-26

我有我的api控制器:

public BlogController
{
    public Blog[] Get()
    {
        return context.Blogs.ToArray();
    }
    public Blog Get(Guid id)
    {
        return context.Blogs.FirstOrDefault(b => b.Id.Equals(id));
    }
}

我如何设置我的Angular资源来模拟这个?

我是这样开始的:

angular.module('spaTestApp.home.services', [])
    .factory('blogRepository', ['$resource', function($resource) {
            return {
                get: function() {
                    return $resource('/api/Blogs').query();
                }
            }
        }
    ]);

然后我想我可能需要这样做:

angular.module('spaTestApp.home.services', [])
        .factory('blogRepository', ['$resource', function($resource) {
            return $resource('/api/Blogs/:id', {}, {
                query: {method:'GET', params:{id:'WHAT_GOES_HERE'}, isArray:true}
            });
        }]);

我不完全确定WHAT_GOES_HERE中发生了什么,然后如何调用get,我认为它将是:

blogRepository.query($selectedId);

您不需要在资源定义时提供所选值,因此您可以将其从$resource配置对象中删除。

相反,当你调用方法时,你使用

blogRepository.query({id:$selectedId});

如果你看一下angular文档,它解释了你应该在哪里做这些。https://docs.angularjs.org/api/ngResource/service/美元资源

有一节是关于用户资源的,如下所示:

var User = $resource('/user/:userId', {userId:'@id'});
  var user = User.get({id:123}, function() {
    user.abc = true;
    user.$save();
  });

当使用工厂时,你可以走下面的路线

 app.factory('Blog', ['$resource', function($resource) {
        return $resource('/api/v1/blogs/:id', {id: '@id'});
    }
 ]);

或者如果您想添加更新和查询部分

app.factory('Blog', ['$resource', function($resource) {
   return $resource('/api/v1/blogs/:id', {id: '@id'},
       {
           'update': { method:'PUT' }
           'query':  { method:'GET', isArray:true},
       });
   }
]);

那么当调用get

Blog.get({id: $scope.selectedId});

或者使用集合调用

Blog.query();

也可以像promise一样处理

Blog.get({id: $scope.selectedId})
   .$promise.then(function(response){
     //do something with response
   });

如果你想获取一个资源集合

$scope.blogs; //If this is your blogs collection
Blog.get()
   .$promise.then(function(response){
       $scope.blogs = response;
   });

请记住,console.log(response)将返回一个包含2个额外组件的数组,即promise被解析和$promise。一旦将其设置为作用域变量,它将只是一个资源数组。