Angularjs чат
Включите опыт обмена сообщениями для приложений Web, iOS и Android. Скоро AngularJs и лучшие рамки Ionic, Pubnub, PhoneGAP
npm install angular-chatbower install angular-chatВключите угловые файлы чата в свой шаблон.
< 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' ] ) ; Чтобы использовать AngularJS-Chat, вы должны настроить соединение с сервисом в реальном времени. Эта библиотека включает в себя RLTM.JS как зависимость, которая позволяет легко переключаться между поставщиками услуг в реальном времени, такими как Socket.io и Pubnub. Мы рекомендуем настроить с PubNub, чтобы начать быстро и масштабировать до бесконечности.
angular . module ( 'chat' ) . constant ( 'config' , {
rltm : {
service : "pubnub" ,
config : {
"publishKey" : "demo" ,
"subscribeKey" : "demo"
}
}
} ) ; Модуль чата открывает объект, называемый Messages , который включает метод send и 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
} ) ;
} ;
} ] ) ; В этом контроллере мы храним список сообщений в $scope.messages и разжигаем новое сообщение каждый раз, когда называется обратный вызов Messages.receive() .
Чтобы отправить сообщение через Интернет, мы используем метод Messages.send() и прикрепляем его к `` $ scope.send () `` ``, чтобы мы могли вызвать его с DOM.
Мы используем метод $scope.send() и $scope.messages переменная.
< 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 >Установите некоторую идентификацию для этого пользователя.
Messages . user ( { id : MY_USER_ID , name : sillyname ( ) } ) ;Отправьте сообщение другому пользователю.
Messages . send ( { to : target_user_id , data : message_body } ) ;Если вы хотите случайные идентификаторы пользователей, которые являются переходными ... вы можете опубликовать список пользователей на канале «Глобал» и принять каждого пользователя, который вышел в интернет.
Проверьте /examples/basic/index.html для примера чата, в котором каждый посетитель может поболтать.
Проверьте /examples/support-chat/index.html chat/index.html и /examples/support-chat/admin.html support-chat/admin.html для примера встроенного чата для встроенного типа поддержки. Page index.html может общаться только с пользователем на admin.html . Page admin.html создает новый экземпляр чата для каждого нового пользователя на index.html .