Enable messaging experiences for Web, iOS and Android apps. Coming Soon AngularJS and the best frameworks Ionic, PubNub, PhoneGap
npm install angular-chatbower install angular-chatInclude the angular chat files in your template.
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/rltm/web/rltm.js"></script>
<script src="bower_components/angular-chat/angular-chat.js"></script>var chat = angular.module('BasicChat', ['chat']);In order to use angularjs-chat, you must configure a connection to a realtime service. This library includes rltm.js as a dependency which lets you switch between realtime service providers like Socket.io and PubNub easily. We recommend setting up with PubNub to get started quickly and scale to infinity.
angular.module('chat').constant('config', {
rltm: {
service: "pubnub",
config: {
"publishKey": "demo",
"subscribeKey": "demo"
}
}
});The chat module exposes an object called Messages which includes
a send and receive method.
chat.controller( 'chat', [ 'Messages', '$scope', function( Messages, $scope ) {
// Message Inbox
$scope.messages = [];
// Receive Messages
Messages.receive(function(message) {
$scope.messages.push(message);
});
// Send Messages
$scope.send = function() {
Messages.send({
data: $scope.textbox
});
};
}]);In this controller we keep a list of messages in $scope.messages and
push a new message every time the Messages.receive() callback is called.
To send a message over the Internet, we use the Messages.send() method
and attach it to ```$scope.send()```` so we can call bind it to the DOM.
We use the $scope.send() method and $scope.messages variable in
our view.
<div ng-app="BasicChat">
<div ng-controller="chat">
<div ng-repeat="message in messages">
<strong>{{message.user.name}}:</strong>
<span>{{message.data}}</span>
</div>
<form ng-submit="send()">
<input ng-model="textbox">
</form>
</div>
</div>Set some identification for this user.
Messages.user({ id: MY_USER_ID, name : sillyname() });Send a message to another user.
Messages.send({ to: target_user_id, data : message_body });If you want random user id's that are transient... you can publish the LIST of users to the "global" channel and receive each user who has come online.
Check out /examples/basic/index.html for an example of a chatroom that
every visitor can chat in.
Check out /examples/support-chat/index.html and
/examples/support-chat/admin.html for an example of a embedded support
type chatroom. The page index.html can only chat with the user on
admin.html. The page admin.html creates a new instance of a
chatroom for every new user on index.html.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent