Przeglądaj źródła

replace hashtags pipe

Carsten Porth 6 lat temu
rodzic
commit
f31dd4cb94

+ 3 - 0
app/src/app/app.scss

@@ -14,3 +14,6 @@
 // To declare rules for a specific mode, create a child rule
 // for the .md, .ios, or .wp mode classes. The mode class is
 // automatically applied to the <body> element in the app.
+.hashtag {
+    color: color($colors, primary, base);
+}

+ 1 - 1
app/src/components/tweet-body/tweet-body.html

@@ -1,4 +1,4 @@
 <!-- Generated template for the TweetBodyComponent component -->
 <div>
-  <p [innerHTML]="text | replaceUrls: entities.urls"></p>
+  <p [innerHTML]="text | replaceUrls: entities.urls | replaceHashtags: entities.hashtags"></p>
 </div>

+ 5 - 2
app/src/pipes/pipes.module.ts

@@ -2,13 +2,16 @@ import { NgModule } from '@angular/core';
 import { FriendlyNumberPipe } from './friendly-number/friendly-number';
 import { DiffForHumansPipe } from './diff-for-humans/diff-for-humans';
 import { ReplaceUrlsPipe } from './replace-urls/replace-urls';
+import { ReplaceHashtagsPipe } from './replace-hashtags/replace-hashtags';
 @NgModule({
 	declarations: [FriendlyNumberPipe,
     DiffForHumansPipe,
-    ReplaceUrlsPipe],
+    ReplaceUrlsPipe,
+    ReplaceHashtagsPipe],
 	imports: [],
 	exports: [FriendlyNumberPipe,
     DiffForHumansPipe,
-    ReplaceUrlsPipe]
+    ReplaceUrlsPipe,
+    ReplaceHashtagsPipe]
 })
 export class PipesModule {}

+ 22 - 0
app/src/pipes/replace-hashtags/replace-hashtags.ts

@@ -0,0 +1,22 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+/**
+ * Generated class for the ReplaceHashtagsPipe pipe.
+ *
+ * See https://angular.io/api/core/Pipe for more info on Angular Pipes.
+ */
+@Pipe({
+  name: 'replaceHashtags',
+})
+export class ReplaceHashtagsPipe implements PipeTransform {
+  /**
+   * Takes a string and highlights the hashtags.
+   */
+  transform(value: string, ...args) {
+    for (let hashtag of args[0]) {
+      value = value.replace('#' + hashtag.text, '<span class="hashtag">#' + hashtag.text  + '</span>');
+    }
+
+    return value;
+  }
+}

+ 1 - 1
app/src/pipes/replace-urls/replace-urls.ts

@@ -10,7 +10,7 @@ import { Pipe, PipeTransform } from '@angular/core';
 })
 export class ReplaceUrlsPipe implements PipeTransform {
   /**
-   * Takes a string and replace the urls with hyperlinks.
+   * Takes a string and replaces the urls with hyperlinks.
    */
   transform(value: string, ...args) {
     for (let url of args[0]) {