CODEWITHSUNDEEP
angularjs
irom
irom

Reputation: 3606

bind angularjs textarea to model after updating by controller

In my controller I update a textarea with $http. It works as expected. But now I would like to bind message1, and message2 to from model, how to do it ?

RESULT:

This is {{message1}} in 1st line
This is {{message2}} in last line

in CONTROLLER:

$scope.myTextArea = response.data;

in HTML:

<form name="myform">
  <p><input type="text" ng-model="message1"/>Message1</p>
  <p><input type="text" ng-model="message2"/>Message2</p>
</form>
<p>
  <textarea type="text" id="textarea" model="myTextArea" cols="80" rows="10" >
    {{myTextArea}}
  </textarea>
</p>

Upvotes: 0

Views: 452

Answers (2)

Sergei Svekolnikov
Sergei Svekolnikov

Reputation: 661

You mean that you want to put both messages to textarea? Then you need to use watch

$scope.$watchGroup(['message1', 'message2], function(newValues, oldValues, scope) {
    $scope.myTextArea = 
    'This is '+message1+' in 1st line\r\n'+
    'This is '+message2+' in last line'
});

Upvotes: 1

Avalanche
Avalanche

Reputation: 1548

Wrapping means that you need to place your code inside the built-in ng-controller directive in order to achieve anything.

Here is also a working copy at plunker.

<body ng-app="myApp">
    <form name="myform" ng-controller="myController">

          <!-- Place your "RESULT" inside the controller (myController) scope -->
          This is {{message1}} in 1st line <br />
          This is {{message2}} in last line

          <p><input type="text" ng-model="message1"/>Message1</p>
          <p><input type="text" ng-model="message2"/>Message2</p>
    </form>
    <p>
          <textarea type="text" id="textarea" model="myTextArea" cols="80" rows="10" >
            {{myTextArea}}
          </textarea>
    </p>
</body>

Upvotes: 1

Related Questions