mervick / emojionearea

Emoji Picker Plugin for jQuery
https://jsfiddle.net/mervick/1v03Lqnu/765/
MIT License
953 stars 257 forks source link

ng-model not working in Angular #422

Open superlep opened 3 years ago

superlep commented 3 years ago

I have this code: HTML `

                <div style="width:30%">
                <input type="text" ng-model="Comment.Text" id="emojionearea2" name="Comment.Text" >
                </div>
                <br>
                <button ng-click="sendMessage()">clik me </button>
        </div>`

CH.JS app.controller( 'ChatController', ['$scope', function( $scope ) { $scope.Comment = {}; $scope.Comment.Text = 'hello';

$scope.sendMessage = function() {
    if ($scope.Comment.Text) {
                                              alert($scope.Comment.Text);
                            }
                            else
                            {
                            alert("nOT WORKING empty value");
                            }
        var message = $scope.Comment.Text;
        var messageBox = document.querySelector('#messages');
        socket.emit( 'sendMessage', message );

        var messageElement = angular.element( '<p class="message"><b>You</b>: ' +emojione.unicodeToImage(htmlEntities( message )) + '</p>' );
        angular.element( messageBox ).append( messageElement );
        messageBox.scrollTop = messageBox.scrollHeight;
        $scope.Comment.Text = '';

}

socket.on( 'receiveMessage', function( data ) {
    var messageBox = document.querySelector('#messages');
    var messageElement = angular.element( '<p class="message"><b>' + data.sender + '</b>: ' + data.message + '</p>' );
    angular.element( messageBox ).append( messageElement );
    messageBox.scrollTop = messageBox.scrollHeight;
});

function htmlEntities(str) {
    return String(str).replace(/&/g, '&').replace(/</g, '&lt;').replace(/>/g, '>').replace(/"/g, '"');
}

$(function(){
    $("#emojionearea2").emojioneArea({
pickerPosition: "right",
autocomplete: false,
tonesStyle: "radio"

}); }) }]);

the problem is that after the click it does not return the ng-model value, that is Comment.Text. , indefinite , enter always in alert("nOT WORKING empty value");