ruby-on-rails – 我们如何以干燥的方式使用带有angularjs的rail
首先,我会为我破碎的英语和破碎的代码表示遗憾……(这里有很多单词来自谷歌翻译……所以,我担心我不能说清楚……所以,我粘贴所有代码…)
在rails中设置路由非常简单.但是当我们想把它变成angurjs时,它变得有点冗长……对于这类工作有没有“最佳实践”: 给出一些rails路由资源: resources :users resources :photos ... resources :topics 怎么做角度方面呢? 这是我的方式(在咖啡脚本中,使用角度1.1.4): 以Rails方式使用RESTful服务: # angular/services/restful.js.coffee # RESTful resource following Rails route's convention # index: GET '/resource.json' # save: POST '/resource.json' # get: GET '/resource/:id.json' # update: PUT '/resource/:id.json' # edit: GET '/resource/:id/edit.json' # new: GET just use get,id: 'new' app.factory('RESTful',['$resource',($resource)-> (resource_name) -> url = "/#{resource_name}/:id:format" defaults={format: '.json',id: '@id'} actions = { index: id: '' url: "/#{resource_name}:format" method: 'GET' isArray:false edit: url: "/#{resource_name}/:id/edit:format" method: 'GET' update: method: 'PUT' save: url: "/#{resource_name}:format" method: 'POST' } $resource url,defaults,actions ]) # index: GET '/parents/:parent_id/children.json' # save: POST '/parents/:parent_id/children.json' # get: GET '/parents/:parent_id/children/:id.json' # update: PUT '/parents/:parent_id/children/:id.json' # edit: GET '/parents/:parent_id/children/:id/edit.json' # new: GET just use get,id: 'new' app.factory('NESTful',($resource)-> (parents,children) -> # naive singularize parent = parents.replace(/s$/,'') url = "/#{parents}/:#{parent}_id/#{children}/:id:format" defaults={ format: '.json',id: '@id' } actions = { index: id: '' url: "/#{parents}/:#{parent}_id/#{children}:format" method: 'GET' isArray:false edit: url: "/#{parents}/:#{parent}_id/#{children}/:id/edit:format" method: 'GET' update: method: 'PUT' save: url: "/#{parents}/:#{parent}_id/#{children}:format" method: 'POST' } $resource url,actions ]) 路线: app.config(['$routeProvider','$locationProvider',($routeProvider,$locationProvider) -> $locationProvider.html5Mode(true) # general RESTful routes resource_list = ['users','photos','topics'] for resource in resource_list # naive singularize singular = resource.replace(/s$/,"") captialize = singular.charAt(0).toUpperCase() + singular.slice(1) $routeProvider .when "/#{resource}",templateUrl: "/tp/#{resource}/index" controller: "#{captialize}IndexCtrl" resolve: index: ["#{captialize}Loader",(Loader)-> Loader('index')] .when "/#{resource}/new",templateUrl: "/tp/#{resource}/edit" controller: "#{captialize}NewCtrl" resolve: resource: ["#{captialize}Loader",(Loader)-> Loader('new')] .when "/#{resource}/:id",templateUrl: "/tp/#{resource}/show" controller: "#{captialize}ShowCtrl" resolve: resource: ["#{captialize}Loader",(Loader)-> Loader('show')] .when "/#{resource}/:id/edit",templateUrl: "/tp/#{resource}/edit" controller: "#{captialize}EditCtrl" resolve: resource: ["#{captialize}Loader",(Loader)-> Loader('edit')] # special routes $routeProvider .when '/',templateUrl: '/tp/pages/home' controller: 'PageCtrl' .otherwise({redirectTo: '/'}) ]) 控制器应该超级干净,然后我们可以专注于商务 app.controller 'UserShowCtrl',['$scope','resource' ($scope,resource)-> $scope.user = resource.user ] app.controller 'UserIndexCtrl','index',($scope,index) -> $scope.users = index.resource.users $scope.total_pages = index.pages.total_pages $scope.currentPage = index.pages.current_page getPage = (page)-> index.resource.$index page: page (resource,headers)-> $scope.users = resource.users $scope.$watch 'currentPage',(newval)-> getPage(newval) ] 问题出在Loader for resolve obj中: app.factory('UserLoader',['RESTful','$route','$q',(RESTful,$route,$q) -> (action)-> model = 'users' delay = $q.defer() fetcher = RESTful(model) switch action when 'index' fetcher.index page: $route.current.params.page (resource,headers)-> delay.resolve resource: resource pages: JSON.parse(headers('X-Pagination')) (resource)-> delay.reject "Unable to fetch #{model} index" when 'show' fetcher.get id: $route.current.params.id (resource)-> delay.resolve(resource) (resource)-> delay.reject "Unable to fetch #{model} #{$route.current.params.id}" when 'edit' fetcher.edit id: $route.current.params.id (resource)-> delay.resolve(resource) (resource)-> delay.reject "Unable to fetch #{model} #{$route.current.params.id} edit" when 'new' fetcher.get id: 'new' (resource)-> delay.resolve(resource) (resource)-> delay.reject "Unable to fetch #{model} new" return delay.promise ]) 这里有两个问题: 最后,感谢您的耐心等待,我会再次对不起… 解决方法
除了你对这个问题的描述非常复杂(大量的代码)之外,我认为你错过了REST API概念.
您正在将Rails后端资源(及其路由)与客户端路由混合在一起.这是错误的恕我直言.您的前端应用程序路由不应该在REST路由上跳跃(阴影). 你的客户端路线应该是这样的 / /userprofile /dashboard /articles/2013?page=4 坐在这些路由上的控制器应该使用您的资源服务从REST API获取所需的数据,如下所示: angular.module('myApp').controller 'UserProfileController',userResource) -> $scope.user = userResource.query({id: SOME_ID}) angular.module('myApp.resources').factory 'userResource',($resource) -> params = { id: '@id' subItem: '@subItem' subItemId: '@subItemId' } actions = { query: { method: 'GET' params: {} isArray: true } ban: { method: 'POST' params: {banned: true} } } return $resource('/api-1.0/users/:id/:subItem/:subItemId',params,actions) (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |