Chat de angularjs
Habilite experiencias de mensajería para aplicaciones web, iOS y Android. Próximamente Angularjs y los mejores marcos Ionic, Pubnub, PhoneGap
npm install angular-chatbower install angular-chatIncluya los archivos de chat angulares en su plantilla.
< 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' ] ) ; Para usar AngularJS-Chat, debe configurar una conexión a un servicio en tiempo real. Esta biblioteca incluye RLTM.JS como una dependencia que le permite cambiar entre proveedores de servicios en tiempo real como Socket.io y PubNub fácilmente. Recomendamos configurar con PubNub para comenzar rápidamente y escalar a Infinity.
angular . module ( 'chat' ) . constant ( 'config' , {
rltm : {
service : "pubnub" ,
config : {
"publishKey" : "demo" ,
"subscribeKey" : "demo"
}
}
} ) ; El módulo de chat expone un objeto llamado Messages que incluye un método send y receive .
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
} ) ;
} ;
} ] ) ; En este controlador, mantenemos una lista de mensajes en $scope.messages y presionamos un nuevo mensaje cada vez que se llama a la devolución de llamada Messages.receive() .
Para enviar un mensaje a través de Internet, usamos el método Messages.send() y lo adjuntamos al `` `$ scope.send ()` `` `para que podamos llamar al DOM.
Utilizamos el método $scope.send() y $scope.messages variable en nuestra vista.
< 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 >Establezca alguna identificación para este usuario.
Messages . user ( { id : MY_USER_ID , name : sillyname ( ) } ) ;Envíe un mensaje a otro usuario.
Messages . send ( { to : target_user_id , data : message_body } ) ;Si desea identificaciones de usuario aleatorias que sean transitorias ... puede publicar la lista de usuarios en el canal "global" y recibir a cada usuario que se haya conectado.
Echa un vistazo /examples/basic/index.html para ver un ejemplo de una sala de chat en la que cada visitante pueda chatear.
Echa un vistazo /examples/support-chat/index.html y /examples/support-chat/admin.html para obtener un ejemplo de una sala de chat de tipo de soporte integrado. La página index.html solo puede chatear con el usuario en admin.html . La página admin.html crea una nueva instancia de una sala de chat para cada nuevo usuario en index.html .