title: How to program a dropdown option to load a JSON file?
body: <p>I am attempting to develop a javascript web application. In this application, I need a drop-down list of various commercial industries (options: Healthcare, Banking, Education etc.). When a user selects an option and clicks the "next" button the application needs to load a JSON file specific to the option chosen (Healthcare.json, Banking.json, Education.json etc.).</p>
  
  <p>My question is: How do I link each option from the dropdown list to a specific JSON file? So that the JSON file is loaded when the "next" button is clicked.</p>
  
  <p>I have a working list and button (for me that is an achievement) but can't figure out how to link a JSON and load it.</p>
  
  <p>Sub-question:
  Where do I store these industy specific json files? Just in the same folder as my javascript code? </p>
  
  <p>This is my first application so any help is greatly appreciated!</p>
  
  <p>I have searched SOF and google and have come up empty-handed. I have only found "how to populate a list with json data" and "how to build a dynamic list from a json array" neither of which are what I am looking for.</p>
  
  <p>I expect the working solution to simply load the JSON file associated with each industry once the "next" button is clicked.</p>
  
  <p>Thanks in advance</p>
  
  <p><strong>THIS IS MY CODE:</strong></p>
  
  <p>THIS IS MY LIST:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;mat-form-field&gt;
      &lt;mat-select placeholder="Industry" [(ngModel)]="industry"&gt;
          &lt;mat-option [value]="1"&gt;None&lt;/mat-option&gt;
          &lt;mat-option [value]="2"&gt;Healthcare&lt;/mat-option&gt;
          &lt;mat-option [value]="3"&gt;Banking&lt;/mat-option&gt;
          &lt;mat-option [value]="4"&gt;Education&lt;/mat-option&gt;
          &lt;mat-option *ngFor="let vm of viewModelsService.viewModels" [value]=vm&gt;
              {{vm.name}}
          &lt;/mat-option&gt;
      &lt;/mat-select&gt;
  &lt;/mat-form-field&gt;
  </code></pre>
  
  <p>THIS IS MY BUTTON:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;button mat-button [disabled]="getScoreExpressionError()" (click)="loadJSON(); showScoreVariables = false"&gt;Next&lt;/button&gt;
  </code></pre>