angularjs を使用してファイルのアップロードを処理したいと考えています。コントローラーに含まれるモデル、ビュー、コントローラー、およびサービスをセットアップしました。
#Model
window.App.factory 'RepositoryItem', (railsResourceFactory) ->
railsResourceFactory
url: '/api/repository_items/{{_id && _id.$oid}}'
name: 'repository_item'
#Service
window.App.service 'fileUpload', (RepositoryItem) ->
this.files = {}
this.remove = (field) =>
itemToRemove = field.value
if (itemToRemove)
field.value.remove().then ->
index = field.items.indexOf itemToRemove
field.items.splice index, 1
field.value = field.items[0]
this.init = (task, field) =>
# IT WORKS
RepositoryItem.query({
realm: task.variables.realm, criterion:{taskId: task.id, formType: field.id}
}).then (fileItems) =>
this.files[field.id] = fileItems
this.upload = (task, field, element) =>
for file in element.files
reader = new FileReader()
reader.onload = (event) =>
# IT DOES NOT WORK
new RepositoryItem({
formType: field.id, taskId: task.id, content: event.target.result, name: file.name
}).create().then (newItem) =>
console.log 'newItem'
console.log newItem
this.rootScope.$apply =>
this.files[field.id].push newItem
reader.readAsBinaryString file
#View
<script type="text/ng-template" id="fileUpload">
<div class="field">
<table class='attachments' ng-init="fileUpload.init(task, f)">
<tr>
<td> Attachments </td>
<td></td>
</tr>
{{ fileUpload.files }}
<tr ng-repeat="file in fileUpload.files[f.id]">
<td> {{file.name}} </td>
<td> XXX </td>
</tr>
</table>
<input type="file" multiple onchange="angular.element(this).scope().fileUpload.upload({{task}}, {{f}}, this)"/>
</div>
</script>
そして、アップロード メソッド内で、新しい RepositoryItem を作成しようとします。このメソッドはサーバーにリクエストを送信する必要がありますが (init アクションの場合と同様)、リクエストは送信しません。どうすれば修正できますか?
アップ 1:
rails-angular-resource のネストされた呼び出しを追跡しました。$http(config) を呼び出しますが、ネットワーク コンソールでもサーバーでもリクエストは追跡されません。