javascript - 在 Angular/Ionic 应用程序中添加连字符

Question

我在 Ionic 3 应用程序中使用 ionic 网格。有些词不适合列，因此被 chop 并在下一行继续。没有添加连字符(“-”)并且分隔没有任何语法上下文。像这样:

这看起来真的很丑。我想以某种方式添加连字符。但是，我没有让它运行。

我尝试了css-way(如下)，但是没有任何效果

<ion-grid lang="...">

ion-grid{
   -ms-hyphens: auto;
   -webkit-hyphens: auto;
   hyphens: auto;
}

有没有人知道如何做到这一点？

Answer 1

正如torazaburo 在评论中所建议的那样，我决定使用javascript 库。我最终使用了 hypher-library布拉姆斯坦。

效果很好。我在 Ionic 3 中的实现:

homePage.ts

// after imports declare hypher-variables
var Hypher = require('hypher');
var german = require('hyphenation.xx');
// xx stands for the language-pattern, e.g. "en-us". A full list can be found here: https://github.com/bramstein/hyphenation-patterns/tree/master/patterns

@Component({
  selector: 'home-page',
  templateUrl: 'home.html'
})

export class HomePage {
  h = new Hypher(language);  

  constructor(...) { }

  hyphenateWord(){
    let hypenatedWord = this.h.hyphenateText("ThisIsAVeryLongWord);
  }

}