まず第一に、私は私の壊れた英語と壊れたコードについて申し訳ありません...(ここの多くの単語はグーグル翻訳から来ています.すべてのコードを貼り付けます...)
レールにルートを設定するのはとても簡単です。しかし、それをangurjsにワープしたいときは、少し冗長になります...この種の仕事のための「ベストプラクティス」はありますか:
いくつかのレールルートリソースが与えられた場合:
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',
($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, defaults, 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', ['$scope', '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)
]
問題は解決 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
])
ここには 2 つの問題があります: 最初の問題は、上記のローダー コードをコピー && ペーストしてから、gsub('user', 'photo') などをコピーする必要があることです... (実際には 2 つの単語を変更するだけですが、コピー && は嫌いです)貼り付け..) 動作しない for ループで移動しようとしましたが、理由がわかりません... 別の問題は、ネストされたリソースを DRY 方法で設定する方法です。
最後に、ご不便をおかけして申し訳ございません。また、解決策、提案、またはベスト プラクティスはありますか? 私はそれを間違っていますか?