Angularjs Create textarea with option add value from template -

i trying create form textarea user can type text , can choose predefined templates.

here want allow user type in textarea , have option search predefined templates input box above that.

i can type when adding value template not added `textarea.

in input box have onchange function append selected template ng-model of textarea.

the user may type few lines , add templates.

templates few strings added user previously.

template example: "this wonderful place."

<input id="catg" type="text" placeholder="enter text / select template" ng-model="newdata" class="form-control" uib-typeahead="template template.content template in gettemplate($viewvalue) | limitto:8" typeahead-on-select="onselect($item)" typeahead-min-length="1" typeahead-no-results="noresults">  <textarea ng-model="uservalue"></textarea> 

js:

$scope.onselect = function(data) {     $scope.uservalue.concat(data) } 

you can watch changes in ng-model value text area , update textarea accorddingly

var app = angular.module('myapp', []);    app.controller('mainctrl', ['$scope', function ($scope) {      $scope.txt='';            $scope.reset = function() {          $scope.txt = '';      };      $scope.$watch('template.text',function(oldval,newval){        if(newval!==undefined)         $scope.txt= newval + "\n";            })  }]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>  <div ng-app="myapp" ng-controller="mainctrl">  <input style="float:left;" type="text" ng-model="template.text">  <textarea id="textarea" ng-model="txt" style="float:left;">        </textarea>        <div>{{txt}}</div>    <!--<button id='btn' ng-click="txt=''">reset textarea</button>-->      <button id='btn' ng-click="reset()">reset textarea</button>  </div>