私はAngularJSを初めて使用しますが、これまでのところその方法論は気に入っていますが、まだ適応している考え方の変更がいくつかあります。(私はCoffeescriptとHamlを使用しています。そして、私の質問に関係のない、すべき/すべきでないことを見つけたら、私に知らせてください。繰り返しになりますが、私はAngularを初めて使用します。)
次のように設定されたリソースがあります。
app.factory "ServiceRequest", ["$resource", ($resource) ->
$resource("/service_requests/:id", {id: "@id"}, {update: {method: "PUT"}})
]
app.controller "ServiceRequestController", ["$scope", "ServiceRequest", ($scope, ServiceRequest) ->
$scope.service_requests = ServiceRequest.query()
特にRailsとRESTfulコントローラーに精通している場合は、それほど凝ったことはありません。次に、それらをindex.html.hamlページに表示します。
.service-request{'ng-repeat' => 'service_request in service_requests'}
.upper
#...
%a.btn{:href => "", 'ng-click' => "toggleExpand(service_request)"}
.lower{'ng-show' => 'service_request.expanded'}
#...
toggleExpand(service_request)を呼び出すボタンに注目してください。
$scope.toggleExpand = (service_request) ->
service_request.expanded = not service_request.expanded
したがって、これは、変数を変更する別のボタンをクリックしてからservice_request。$ update()をクリックするまで機能します。Railsコントローラーは、展開された変数を消去するJSONservice_request変数を返します。くだらない。
$scope.acceptRequest = (service_request) ->
service_request.state_change = "accept"
service_request.$update()
Angularの見事な双方向バインディングをまだ利用しているブラウザでのみ使用されることを意図したこれらの非データベース変数を管理するためのより良い方法は何ですか?
ありがとう!もうコードが必要な場合はお知らせください。=)
//これは私が問題を解決するためにしたことです。
JSの場合:
$scope.init = () ->
$scope.toggleFlags = {}
angular.forEach $scope.service_requests, (service_request) ->
$scope.toggleFlags[service_request.id] = false
$scope.toggleExpand = (id) ->
if not $scope.toggleFlags
$scope.init()
$scope.toggleFlags[id] = not $scope.toggleFlags[id]
HTMLの場合:
%a.btn{:href => "", 'ng-click' => "toggleExpand(service_request.id)"}