最近在用angular8仿網易雲音樂的pc端,考慮出個ng相關的教程
寫到歌詞的時候開始直接用了黃大仙的lyric-parser,發現不太適用網易雲的歌詞,主要有以下幾點:git
其中第二點的狀況比較棘手,好比英文歌詞比中文的開頭多幾行,好比這種:github
反過來也有可能。
因此須要改下lyric-parser中的initLines方法。
lyric字段是主歌詞,我只要保證主歌詞完整,tlyric每行只要對應上lyric就好了,因此我先把tlyric開頭多餘的行給過濾掉了:app
而後把lyric字段開頭多餘的幾行單獨抽出來,這樣lyric和tlyric就一一對應了。再利用rxjs中的zip方法能夠方便地處理這種對應的數據流:spa
zip方法會嚴格對應地輸出流,把每行的中文,英文和歌詞的時間戳保存起來就好了:3d
其餘部分不用怎麼修改,angular用戶能夠直接copy下來試下,項目地址blog