JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/lodash.js/1.3.1/lodash.min.js"></script>
<form name="myform" ng-app ng-controller="MyController">
    <input type="text" required ng-model="form.input.key" placeholder="key">
    <input type="text" required ng-model="form.input.val" placeholder="val">
    <button ng-disabled="!myform.$valid" ng-click="form.add()">Добавить</button><br><br>
    
        <div ng-repeat="el in form.filtered()">
            {{el.key}} — "{{el.val}}"
        </div><br>
     
 
</form>

JavaScript

function MyController($scope){
   $scope.form = {
      input: {key:'', val:''}, // Этот объект будем заполнять новыми значениями
      array: [
         {key:'pear', val:'Груша'}, // Предустановка
         {key:'melon', val:'Дыня'},
         {key:'ananas', val:'Ананас'},
         {key:'cherry', val:'Вишня'}
      ],
      order: 'key', // По умолчанию сортируем по свойству key (2 ключа key/val)
      check: false, // Это нужно для теста с доп. ключами кэша (2 ключа — true/false)
      add: function(){ // Метод добавляет новые значения из формы в общий котёл
         this.array.push(angular.copy(this.input));
         this.filtered.cache = {} // Сбрасываем весь кэш
      },
      filtered: _.memoize( // Обращаем внимание
         function(){
            console.log('Фильтровал с параметрами: ' + this.order + ' и ' + this.check);
            return _.sortBy(this.array, this.order)
         },
         function(){ // Генератор кэш-ключей
            // Результат всегда конвертируется в строку
            return [this.order, this.check]
         }
      )
   }
}