title: AngularJS Textarea If data Is loading
body: <p>I have a textarea that relies upon a dropdown menu to populate. When the dropdown is changed, a file is pulled and the contents are loaded to the textarea.</p>
  
  <p>While the textarea is loading, it just says <code>[object Object]</code>. I'd like it to be a bit nicer than that. Something like 'Loading...'.</p>
  
  <p>I cant find  away to specifically do this with a textarea though.</p>
  
  <p>Another wrench in the wheel is that the Save functionality actually relies upon the value of the text area to save, so I cant just alter the content of the text area to display 'Saving...' otherwise the content that is written to the file is just 'Saving...'.</p>
  
  <p>Here is the code:</p>
  
  <p><strong>View</strong></p>
  
  <pre><code>&lt;div id="Options" class="panel-collapse collapse"&gt;
      &lt;div class="panel-body"&gt;
          &lt;div class="form-group"&gt;
              &lt;div class="input-group"&gt;
                  &lt;span class="input-group-addon input-sm"&gt;Config Select&lt;/span&gt;
                  &lt;select ng-change="update()" ng-model="configFileName" class="form-control input-sm"&gt;
                      &lt;option&gt;--&lt;/option&gt;
                      &lt;option ng-repeat="conf in configList" value="{{conf.name}}"&gt;{{conf.name}}&lt;/option&gt;
                  &lt;/select&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="form-group"&gt;
              &lt;div class="input-group"&gt;
                  &lt;td style="padding-bottom: .5em;" class="text-muted"&gt;Config File&lt;/td&gt;&lt;br /&gt;
                  &lt;textarea id="textareaEdit" rows="20" cols="46" ng-model="configFileContent"&gt;&lt;/textarea&gt;
                  &lt;input type="button" ng-click="updateConfig()" style="width: 90px;" value="Save"&gt;&lt;/button&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>JS</strong></p>
  
  <pre><code>$scope.update = (function(param) {
      $scope.configFileContent = 'Loading...';
      $scope.configFileContent = $api.request({
          module: 'Radius',
          action: 'getConfigFileContent',
          method: 'POST',
          data: $scope.configFileName
      }, function(response) {
          $timeout(function() {
              console.log('got it');
              $scope.configFileContent = response.confFileContent;
          }, 2000);
      });
  });
  
  $scope.updateConfig = (function(param) {
      var data = [$scope.configFileName, $scope.configFileContent];
      var json = JSON.stringify(data);
      $scope.configFileContent = $api.request({
          module: 'Radius',
          action: 'saveConfigFileContent',
          method: 'POST',
          data: json
      }, function(response) {
          $timeout(function() {
              console.log('Saved!');
              $scope.update();
  
          }, 2000);
      });
  });
  </code></pre>