angularjs الدردشة
تمكين تجارب المراسلة لتطبيقات الويب و 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 index.html للحصول على مثال على غرفة الدردشة التي يمكن لكل زائر الدردشة فيها.
تحقق من /examples/support-chat/index.html chat/index.html و /examples/support-chat/admin.html للحصول على مثال على غرفة دردشة نوع الدعم المدمجة. لا يمكن لـ page index.html الدردشة إلا مع المستخدم على admin.html . يقوم Page admin.html بإنشاء مثيل جديد لغرفة الدردشة لكل مستخدم جديد على index.html .