Есть ли способ привязать NG-модель к нескольким полям ввода уникально внутри директивы?

В моем проекте у меня есть проблема вроде. Мне нужно связать хобби пользователя в текстовом поле. Если пользователь приходит с одним хобби, он может прямо войти в хобби, которое у него есть. но когда у него было несколько, то ему пришлось нажимать кнопку добавления нескольких хобби. Это прекрасно работает, когда я динамически показываю поля ввода с помощью директив. Но проблема в том, что значение, которое исходит от ng-модели для этого поля ввода, является обязательным для всех полей ввода,

Вот мой код.

Заранее спасибо!

это изображения

вот как я получаю

это то, что мне нужно

В HTML

<div>
<div id="showHobbyfield"></div>
<input type="number" class="form-control" placeholder="ADD HOBBIES"
ng-click="addHoby()">
</div>

В контроллере

$scope.addHoby= function(){
      var compiledeHTML = $compile("<div my-hobby></div>")($scope);
      $("#showHobbyfield").append(compiledeHTML);
    };

$scope.addUser = function(){
$scope.Users= [];

var obj = {
  userhobby : $scope.user.morehobies

  };
    $scope.Users.push(obj);
 menuStorage.put($scope.Users);

//menustorage - это сервис для хранения пользователя в localStorage.

В директиве

'use strict';
angular.module('myApp')
  .directive('myHobby', function() {

    return {
      scope : false,
      templateUrl: 'views/my-hobby.html'
    };
  });

это шаблон: my-hobby.html

<div class="input-group">
<input type="text" ng-model="user.morehobies" class="form-control" placeceholder="type your hobbies here">

        <div class="close-icon">
        <span class="glyphicon glyphicon-remove" style="padding-left: 6px;"> </span>
        </div>
    </div>