カスタムディレクティブが動作しない

Question

私は編集された/プライベートな情報のディレクティブを作成しようとしています。 （コンテンツがあったが、ブラックボックスと不可視になるかのように） 特定の情報がブラックボックスを設けていない場合は、私はスタイルが追加されて見ることができる

import { Directive, ElementRef, Renderer, OnInit } from 
'@angular/core'; 

@Directive({ 
selector: '[appRedactedContent]' 
}) 
export class RedactedContentDirective implements OnInit { 
min = 75; 
max = 150; 
width = this.randomIntFromInterval(this.min, this.max); 
constructor(private el: ElementRef, 
      private renderer: Renderer) { 
      } 
ngOnInit() { 
    this.renderer.setElementStyle(
     this.el.nativeElement, 'background-color', 'blue !important'); 
     this.renderer.setElementStyle(this.el.nativeElement, 'width', 
             this.width.toString()); 
    } 

randomIntFromInterval(min: number, max: number): number { 
return Math.floor(Math.random() * (max - min + 1) + min); 
} 
} 

HTML

<a appRedactedContent></a> 

示さなければなりません私は私の開発ツールが、私は、インラインにデフォルトの表示として

Answer 1

私のブラウザでタグを青い箱を見ることができないA-タグを開いたとき、あなたは強制カント幅も高さがあります。

あなたのタグが0の幅などのコンテンツ、それを持っていないとあなたが幅を強制したいならば、あなたはそれを

を参照してくださいカント、あなたはインラインブロック

にその表示を設定する必要がありますと

ref to HTML specs