stop play back of audio recorder

问题

Hi i am trying to create a audio recorder app, currently i user cordova plugin and app starts to record and stop. when i try to play a file, that file does not moves to stop state when audio gets completed and when i click play of two audio in that list both audio file are played

/*this will have the list of all files recorded */
ListAudioFiles(){
        File.listDir(cordova.file.externalRootDirectory, 'myFolder/Audios').then(
          (allFiles) => {
            // do something

            console.log("we have audio files", allFiles);
            console.log("we have audio files", allFiles.length);
            for (var i = 0; i < allFiles.length; i++){ 
                this.MyAudioFiles.push({
                    audio: allFiles[i],
                    status: false                   
                });
                console.log(this.MyAudioFiles);
            }
          }).catch(
          (err) => {
            // do something
            console.log("file listing err", err)
          });
    }


    startPlayback(audio, i) {   
        try {
            console.log("start playback function",audio.name);
            console.log("start playback function",i);
            this.MyAudioFiles[i].status = true;

            var pathalone =  audio.nativeURL;
            this.file = new MediaPlugin(pathalone, (status) => {

            });
            this.file.play(); 
            console.log("playback status", status);         
            console.log("play back file getDuration", this.file.getDuration());

        }
        catch (e) {
            this.showAlert('Could not play recording.');
        }
    }

    stopPlayback(audio, i) {
        console.log("stop pplayback function",audio.name);
        console.log("stop pplayback function",i);
        this.MyAudioFiles[i].status = false;
        this.file.stop(); 
    }

my html is

<ion-list>
        <ion-item *ngFor="let file of MyAudioFiles let i = index ">
            <ion-grid>
                <ion-row>
                    <ion-col width-10 >  
                        <ion-icon style ="padding-top: 9px;"  *ngIf="!file.status" name="play" (click)="startPlayback(file.audio, i)" ></ion-icon>
                        <ion-icon style ="padding-top: 9px;"  *ngIf="file.status" name="square" (click)="stopPlayback(file.audio, i)" ></ion-icon>
                    </ion-col>
                    <ion-col width-67 style ="padding-top:  16px;">

                       {{file.audio.name}}
                    </ion-col>
                    <ion-col width-10>

                        <button *ngIf="!file.upload" (click)="loginPage(file, i)" ion-button color="primary">
                            <ion-icon name="cloud-upload" primary></ion-icon>
                        </button>

                        <button *ngIf="file.upload" ion-button color="primary">
                            <ion-icon name="done-all" primary></ion-icon>
                        </button>
                         <!--button (click)="fileToTrash(file)" ion-button color="danger">
                            <ion-icon  name="trash" primary></ion-icon>
                        </button-->
                    </ion-col>
                </ion-row>
            </ion-grid>
        </ion-item>
    </ion-list>

what i need is when a play button is clicked it should move to stop state when play back gets completed, and multiple audio should not be played at the same time. could someone help me.

来源：https://stackoverflow.com/questions/42522864/stop-play-back-of-audio-recorder