TypeScript material.MatSnackBar类代码示例

    async startUpload(event: FileList) {

        const file = event.item(0);

        // Client-side validation: Must be an image and smaller than 10MB.
        if (file.type.split('/')[0] !== 'image') {
            return this.snackBar.open('Unsupported File Type', '', { duration: 3000, panelClass: 'snackbar-error' });
        }
        // Must be smaller than 20MB, http://www.unitconversion.org/data-storage/megabytes-to-bytes-conversion.html
        if (file.size > 10485760) {
            return this.snackBar.open('Images must be smaller than 10MB', '', { duration: 5000, panelClass: 'snackbar-error' });
        }

        const dictionary = await this.dictionariesService.getDictionary();

        // Replace spaces w/ underscores in dict name, remove special characters from lexeme so image converter can accept filename
        const _dictName = dictionary.name.replace(/\s+/g, '_');
        const _lexeme = this.entry.lx.replace(/[^a-z0-9+]+/gi, '_');
        const fileTypeSuffix = file.name.match(/\.[0-9a-z]+$/i)[0];

        const path = `images/${_dictName}_${dictionary.id}/${_lexeme}_${this.entry.id}_${new Date().getTime()}${fileTypeSuffix}`;

        // optional metadata
        const { displayName, uid } = await this.auth.getUser();
        const customMetadata = { uploadedBy: displayName };

        this.task = this.storage.upload(path, file, { customMetadata });
        this.percentage = this.task.percentageChanges();
        this.task.then(snap => {
            if (snap.state === 'success') { this.savePhoto(path, displayName, uid, this.entry.lx, dictionary.id); }
        }).catch(() => {
            this.snackBar.open('Image Upload Failed', '', { duration: 3000, panelClass: 'snackbar-error' });
        });
    }

 const result = this.betterdb.createUser(details).subscribe( result => {
     if(result['ok']){
         this.snackBar.openFromComponent(ToastComponent, { data: { message: result['ok'], level: "ok"}})
         this.router.navigate([`/users`])
     } else {
         const message = result['type'] == 'not unique' ? "duplicate username or e-mail" : result['error']
         this.snackBar.openFromComponent(ToastComponent, { data: { message: message, level: "error"}})
     }
 })

    this.sw.available.subscribe(evt => {
      const snack = this.snack.open('Dostępna aktualizacja', 'ODŚWIEŻ');

      snack.onAction()
        .subscribe(() => window.location.reload());

      setTimeout(() => {
        snack.dismiss();
      }, 7000);
    });

 setTimeout(() => {
     this.matSnackBar.open('');
     this.matSnackBar.open(
         this.translate.instant('The link is broken. Please contact your system administrator.'),
         this.translate.instant('OK'),
         {
             duration: 0
         }
     );
     this.router.navigate(['/login']);
 });

 map(connected =>
   connected
   ? this.snackBar.open(`Connected to Dotstar`, '', {
       panelClass: ['bgc-green', 'c-black'],
       duration: 3000,
       verticalPosition: 'top',
     })
   : this.snackBar.open(`Connection closed`, 'Reconnect', {
       duration: 3000,
       verticalPosition: 'top',
     })

 /**
  * Copy the source
  *
  * @param {string} text
  */
 copySource(text: string): void
 {
     if ( this._fuseCopierService.copyText(text) )
     {
         this._matSnackBar.open('Code copied', '', {duration: 2500});
     }
     else
     {
         this._matSnackBar.open('Copy failed. Please try again!', '', {duration: 2500});
     }
 }

 d => {
   if (d.success) {
     this.snackBar.open(d.msg, '', {
       duration: 5000,
     });
   } else {
     this.snackBar.open(d.msg, '', {
       duration: 5000,
     });
     this.loadEmail = true;
   }
 }, (err) => {

 public async toggleSetting(setting: string, value: boolean) {
   try {
     const newSetting = { [setting]: !value };
     const dictionary = await this.dictionariesService.currentDictionary.pipe(first()).toPromise();
     await this.afs.doc(`dictionaries/${dictionary.id}/config/settings`).set(newSetting, { merge: true });
     this.snackBar.open('Setting updated', '', { duration: 2000 });
   } catch (err) {
     this.snackBar.open('Failed to update setting.', '', {
       panelClass: 'snackbar-error',
       duration: 3000
     });
   }
 }

 onSubmit() {
   // this method is called if the contact is valid and dirty (no point updating if no changes made)
   this.snackBar.open('Contact created.', '', {duration: 3000});
   this.contact.photo = 'https://robohash.org/etquasiqui.jpg?size=250x250&set=set1';
   this.contactService.createContact(this.contact);
   this.router.navigate(['contacts']);
 }

 reaction(() => this.authStore.authError, (authError) => {
   if (authError) {
     this.snackBar.open(authError, '', {
       duration: 3000
     });
   }
 });

    public displaySimpleAlert(alert: SimpleAlert) {

        this.snackBar.open(alert.message, alert.action || 'OK', {
            duration: alert.duration || 500,
            verticalPosition: "top"
          });
    }

 reaccionar(value) {
   if (this.authService.isAuthenticated()) {
     if ((this.miReaccion.like && value === 1) || (this.miReaccion.dislike && value === 2)) {
       return this.eliminarReaccion();
     }
     const reaccion = {
       comentario_id: this.comentario._id,
       reaccion: value
     };
     this.reaccionService.reaccionar(reaccion)
     .subscribe(res => {
       if (res.status) {
         this.comentarioService.obtenerComentario(this.comentario._id)
         .subscribe(resComentario => {
           if (resComentario.status) {
             const newComentario = resComentario.comentario;
             newComentario.user = this.comentario.user;
             this.comentario = newComentario;
             this.ngOnInit();
             this.snackBar.open('Se ha guardado', 'Ok', {
               duration: 2000
             });
           }
         });
       }
     });
   } else {
     this.snackBar.open('Debe estar registrado', 'Login', {
       duration: 4000
     }).onAction().subscribe(result => {
       this.router.navigate(['/login']);
     });
   }
 }

    /**
     * Submit the new password.
     */
    public async submitNewPassword(): Promise<void> {
        if (this.newPasswordForm.invalid) {
            return;
        }

        try {
            await this.http
                .post<void>(environment.urlPrefix + '/users/reset-password-confirm/', {
                    user_id: this.user_id,
                    token: this.token,
                    password: this.newPasswordForm.get('password').value
                })
                .toPromise();
            // TODO: Does we get a response for displaying?
            this.matSnackBar.open(
                this.translate.instant('Your password was resetted successfully!'),
                this.translate.instant('OK'),
                {
                    duration: 0
                }
            );
            this.router.navigate(['/login']);
        } catch (e) {
            console.log('error', e);
        }
    }

 displaySuccess(message: string, duration: number = 4000, action?: string): void {
   this.snackBar.open(message, action, {
     announcementMessage: message,
     duration,
     panelClass: 'success-snackbar'
   });
 }

 displayErrorMessage(error: string, duration: number = 4000, action?: string): void {
   this.snackBar.open(error, action, {
     announcementMessage: error,
     duration,
     panelClass: 'error-snackbar'
   });
 }