MaterializeCss Toast内にMaterialアイコンを追加しますか？

Question

materializecssトーストメッセージの中にアイコンを追加することはできますか？

私は「[オブジェクトのオブジェクト]」このようにそれをやってみましたが、得たトーストの内側に返さ：

var $printerIcon = $('<i class="material-icons print"></i>'); 

Materialize.toast($printerIcon + 'Your print job was sent',4000); 

Answer 1

問題はJavascriptを文字列に$printerIcon + 'Your print job was sent'を変換しようとしていること、です。そのようなマークアップ内のテキストを追加すること

試してみてください。

const printerIcon = '<i class="material-icons print"></i>'; 
const toastMessage = 'Your print job was sent'; 
const $toastContent = $(`${ printerIcon } ${ toastMessage }`); 
Materialize.toast($toastContent, 4000); 

Answer 2

それは単なるテキストで、アイコンがないショーの,,

テキストとアイコンのためにこの方法を試してください。

const Icon = '<i class="material-icons print">done_all</i>'; 
const Message = 'Your print job was sent'; 
const $toast = Icon +Message ; 
Materialize.toast($toast, 4000); 

これがあなたを助けてくれることを願っています

Answer 3

あなたはcssで修正することができます：前に

#toast-container{ 

    .toast{  

     &:before{ 
     content: “your-icon”; 

    } 

} 

ウォッチ下記の例：

https://codepen.io/anon/pen/YrGmeg