How to allow one file from each control, with preview? about angular-file-upload HOT 6 CLOSED

Hi, @jon64digital

Thanks.

1. You can disable input element if file was added to the queue. For example:

<input type="file" ng-file-select="{ disabled: true }" ng-disabled="item.disabled" />

https://github.com/nervgh/angular-file-upload/blob/master/angular-file-upload.js#L187
https://github.com/nervgh/angular-file-upload/blob/master/angular-file-upload.js#L206
https://github.com/nervgh/angular-file-upload/blob/master/angular-file-upload.js#L93

2. #37, https://github.com/nervgh/angular-file-upload/blob/master/angular-file-upload.js#L94

3. I don't understand. What is the question?

4. Don't have a clue how to get this info which is passed back

the complete event + the responce param
https://github.com/nervgh/angular-file-upload/blob/master/examples/simple/controllers.js#L59

5. This one I think I have solved, I can add form data to say whether it's a profile pic or a pet pic by doing this, , right?

yes

6. I need to style the elements so that it uses javascript to get the file name and insert it into a text box, and trigger the browse button when the user focuses the textbox?

I don't understand. What is the question?

from angular-file-upload.

Thanks Nervgh, Really appreciate you helping me out.

Sorry I wasn't clear on some of these points....

1. I don't want to disable it after the first file is added, but if a second file is chosen then it should be added to the queue and the previous file should be removed. Would it be possible to use the "afteraddingfile" event to check for files with a duplicate {type: "xxx"} option and remove the oldest one?

2. Sorted

3. In your examples the ngThumb directive is used inside an ngRepeat like this....

<div ng-show="uploader.isHTML5" ng-thumb="{ file: item.file, height: 100 }"></div>

If I wanted to put the thumbnail underneath the input tag (not in a repeater) then how would I get access to this single matching "item" object from the uploader.queue?

4. Sorted
5. Sorted
6. Sorted

Thanks again,

Jon

from angular-file-upload.

1. You can add the id param to ng-file-select directive.

<input type="file" ng-file-select="{ id: 'your_id' }" />

uploader.bind('afteraddingfile', function(event, item) {
    // if item.id is exists and its index !== item index, replace the previous to the current (for example)
});

3. This is your item
   

<div ng-repeat="item in queue">
   your item here
</div>

from angular-file-upload.

That's amazing, thank you.

I had worked out that I could use an ng-repeat to get at the item to make the preview and progress bar, it just didn't seem right to use an ng-repeat when you only wanted to bind to a single item in the queue, but it works!

from angular-file-upload.

I got (1) working with the following code....

uploader.bind('afteraddingfile', function (event, item) {

    var uniqueFieldNames = [];

    for (var i = this.queue.length -1; i >= 0; --i) {;
        if(_.contains(uniqueFieldNames, this.queue[i].fieldName)){
            this.queue.splice(i, 1);
        }
        else{
            uniqueFieldNames.push(this.queue[i].fieldName);
        }
    }

});

from angular-file-upload.

😃

from angular-file-upload.