title: How to get specified htmlelement in my view using angular2 and typescript
body: <p>I am facing a problem. I want to get an htmlelement in my view in angular2
  this is my view</p>
  
  <pre><code>&lt;p&gt;
      &lt;button (click)="setJSON()"&gt;Set JSON&lt;/button&gt;
      &lt;button (click)="getJSON()"&gt;Get JSON&lt;/button&gt;
  &lt;/p&gt;
  &lt;div id="jsoneditor"&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>I would like to access the jsoneditor in my class and pass it to my JSONEditor <a href="https://github.com/josdejong/jsoneditor/blob/master/docs/api.md" rel="nofollow noreferrer">https://github.com/josdejong/jsoneditor/blob/master/docs/api.md</a> to tell it where to rendering the editor.</p>
  
  <p>This is my class:</p>
  
  <pre><code>export class JsonComponent {
  
      container: HTMLElement;
      editor1: JSONEditor;
      options;
  
      constructor(public router: Router, public element: ElementRef) {
  
          this.container = this.element.nativeElement
  
          this.options = { "mode": "tree", "search": true };            
          this.editor1 = new JSONEditor(this.container,this. options);
          var json = {
              "Array": [1, 2, 3],
              "Boolean": true,
              "Null": null,
              "Number": 123,
              "Object": { "a": "b", "c": "d" },
              "String": "Hello World"
          };
          this. editor1.set(json);
          this. editor1.expandAll();
      }                  
  
      setJSON() {
          alert("setJson");
      }
      getJSON() {
          alert("getJson");
      }
  }
  </code></pre>