CODEWITHSUNDEEP
angularjsformstextarea
user1104561
user1104561

Reputation:

Not getting Live Preview for Angular Text Area

I have angular 1.5 Version. The Text Area is not giving the live preview. I've written ng-model and written controller code, now I have no idea what is missing in it.

Controller Code: 

(function() {
        var app = angular.module('wildfire', []);
        var updateStatusText = 'test';
        app.controller('UpdateStatusController', function() {
            this.message = updateStatusText;
            this.updateStatus = function(text) {
                var StatusObject = {};
                updateStatusText = text;
            }

        });
    }

HTML Code: 

<div class="well">
    <form class="form-horizontal" role="form" ng-controller="UpdateStatusController as statusUpdate" ng-submit="statusUpdate.updateStatus(statusUpdate.message)">
        <h4>What's New</h4>{{statusUpdate.message}}
        <div class="form-group" style="padding:14px;">
            <textarea class="form-control" ng-model "statusUpdate.message" placeholder="Update your status"> </textarea>
            {{statusUpdate.message}}
        </div>
</div>

Its not giving the live preview and after submitting it does not send any value associated with the TextArea. I debugged it several time but no result totally frustrating.

Upvotes: 0

Views: 607

Answers (1)

Pratap A.K
Pratap A.K

Reputation: 4517

Change this

ng-model "statusUpdate.message"

To this

ng-model = "statusUpdate.message"

Complete example

<div class="well">
    <form class="form-horizontal" role="form" ng-controller="UpdateStatusController as statusUpdate" ng-submit="statusUpdate.updateStatus(statusUpdate.message)">
        <h4>What's New</h4>{{statusUpdate.message}}
        <div class="form-group" style="padding:14px;">
            <textarea class="form-control" ng-model= "statusUpdate.message" placeholder="Update your status"> </textarea>
            {{statusUpdate.message}}
        </div>
</div>

angular.module('wildfire', []).controller('UpdateStatusController',['$scope', '$http', function($scope, $http){ 

    var updateStatusText = 'test';

        this.message = updateStatusText;
        this.updateStatus = function(text) {
            var StatusObject = {};
            updateStatusText = text;
        }

}]);

Upvotes: 4

Related Questions