title: angularjs ngclick clear and search
body: <p>Trying to solve a problem which looks very simple but hard to understand:-)</p>
  
  <p>I have Json file from where I am trying to get the fetch the data using AngularJS, Based on the User Input (Name), Browser display only those results not the old ones.</p>
  
  <p><strong>names.json</strong></p>
  
  <pre><code>{"name": {
    "Alan": [{ "Class":"1", "Books":"20"}],
    "Sam": [{ "Class":"2", "Books":"204"}],
    "John": [{ "Class":"4", "Books":"240"}],
     }
   }
  </code></pre>
  
  <p>Example:
  Input: Alan</p>
  
  <p>Output: Name: Alan , Class: 1, Books: 20.</p>
  
  <p>I have managed to print the expected result with the following code:</p>
  
  <p><strong>names.js file:</strong></p>
  
  <pre><code>var NamesApp = angular.module('NamesApp', [])
  NamesApp.controller('NameCtrl', function($scope, $http){
  $http.get('names.json').success(function(data) {
            $scope.getit = data;
          });
          $scope.results = [];
          $scope.findValue = function(userInput) { 
          angular.forEach($scope.getit.name, function(value, key) {
        if (key === userInput) {
          $scope.results.push({n: key, c: value[0].Class, b: value[0].Books});
        }
  
      });
  
      };
  });
  </code></pre>
  
  <p>And my HTML file looks like this: </p>
  
  <pre><code>&lt;body ng-controller="NameCtrl"&gt;
    &lt;input type="text" ng-model="userInput"&gt;
    &lt;button type="submit" ng-Click="findValue(userInput)"&gt;Find&lt;/button&gt;
    &lt;h3&gt;Results&lt;/h3&gt;
    &lt;span ng-repeat="result in results"&gt;Name: {{result.n}} , Class: {{result.c}} , Books: {{result.b}}&lt;/span&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>Problem:
  When you search for the first time or after refreshing the page, you will get the results clean.</p>
  
  <p>How should I clean the Search results, before searching for another name?</p>
  
  <p>My Result section should always only the queried results, not the old results.</p>