title: angular4 how to call a function in a external js
body: <p>I have a jscript which displays a log to the console:</p>
  
  <p>x.js contains</p>
  
  <pre><code>function open() {
      console.log('this a function');
  }
  </code></pre>
  
  <p>in index.html of my app</p>
  
  <pre><code>&lt;script src="x.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>in my component</p>
  
  <pre><code>declare var xJS : any;;
  
  @Component({
     selector: 'employerfile',
     templateUrl: './employerfile.component.html'
  })
  
  export class EmployerFileComponent
      .....
      openURL() {
         xJS.open();  
      }
  }
  </code></pre>
  
  <p>in html</p>
  
  <pre><code>&lt;a (click)="openURL()"&gt; click &lt;/a&gt;
  </code></pre>
  
  <p>When I execute this code, I get an exception@</p>
  
  <blockquote>
    <p>Original exception: xJS is not defined</p>
  </blockquote>
  
  <p>How can I call this external function?</p>