AngularJS और Bridgeit.js (मोबाइल वेब ऐप) का एकीकरण

Question

मैं एक कोणीय जेएस वेब ऐप विकसित कर रहा हूं जहां मुझे मोबाइल डिवाइस से पैकेज स्कैन करने की आवश्यकता है और मैं इसके लिए bridgeit का उपयोग कर रहा हूं।

कोणीय में मैंने कार्यक्षमता निष्पादित करने के लिए निम्न कोड लिखा लेकिन यह काम नहीं लगता है।

एचटीएमएल कोड:

<input id="inp" /> 
<button id="scan" ng-click="scan()"> Scan </button> 

जे एस कोड:

// inside angular controller 
$scope.scan = funcction() { 
    bridgeit.scan('scan', 'window.scan'); 
} 

// in global scope 
window.scan = function(event) { 
    alert(event.data); 
} 

परिणाम: bridgeit इच्छा qr/बार कोड को स्कैन करने में सक्षम है, लेकिन अपने मूल्य वापस नहीं करता है ।

Answer 1

कई प्रयासों के बाद, मैंने पाया कि यह समस्या यूआरएल में hashtags के साथ है।

एक ही कोड का उपयोग कर एक उदाहरण लेते हैं,

// inside angular controller 
$scope.scan = funcction() { 
    bridgeit.scan('scan', 'bridgeitCallback'); 
} 

// in global scope 
window.bridgeitCallback = function(event) { 
    alert(event.data); 
} 

मैं एक यूआरएल, जैसे, http://stackoverflow.com/#question है और मैं उस पृष्ठ के अंदर एक स्कैन क्षेत्र की है।तो जब मैं बारकोड स्कैन करें, यह करने के लिए यूआरएल, जैसे कुछ,

http://stackoverflow.com/#c=scan%3Fid%3Dscan%26&r=http%3A//stackoverflow.com%23icemobilesx&o=enc%3Dbase64&h=%26h%3D%2523/question%26c%3DbridgeitCallback%26seq%3D1432552876578

अधिक स्पष्ट रूप से,

http://stackoverflow.com/#c=scan{{some_uri_encode_characters}}/{{your_route,mine_is question}}/{{bridgeit_callback_method}} 

इस प्रकार बदलने के लिए, यह कभी नहीं में सक्षम एक सफल POST कॉलबैक है।

मैं सिर्फ कोणीय में html5Mode सक्षम, के साथ,

$locationProvider.html5Mode(true); 

और सब कुछ एक आकर्षण की तरह काम करता है।

उम्मीद है कि यह भविष्य के उपयोगकर्ताओं को भी मदद करेगा।

Answer 2

वैश्विक दायरे पर एक समारोह को एक नाम देने और इसे पुल करने के लिए गुजरने का प्रयास करें।

अभी तुम सिर्फ यह खिड़की पर एक संपत्ति स्कैन

कहा जाता है के लिए बताए जाते हैं यह भी सुनिश्चित करें कि आप किसी भी अन्य कार्यों के अंदर समारोह नहीं है या किसी तरह से वैश्विक क्षेत्र से छिपा सकते हैं।

ब्रिजिट आपके फ़ंक्शन को कॉल करने के लिए वेबपृष्ठ पर एक स्ट्रिंग का मूल्यांकन करता है।

// inside angular controller 
$scope.scan = funcction() { 
    bridgeit.scan('scan', 'globalScan'); 
} 

// in global scope 
window.scan = function globalScan(event) { 
    alert(event.data); 
} 

अद्यतन:

एक अन्य बात यह है कि मदद कर सकता है अपने वैश्विक समारोह बनाने से पहले आप bridgeit स्क्रिप्ट जोड़ने की कोशिश करना है।

महत्वपूर्ण बिंदु यह है कि पुलिट स्ट्रिंग को संभालती है, आप इसे एक eval फ़ंक्शन में देते हैं और इसे वैश्विक दायरे पर देखते हैं।

function bridgeitCallback(result) 
{ 
    alert("result is: " + JSON.stringify(result)); 
} 

$(document).ready(function readyDoc() 
{ 
    var scanButton = $('#scanButton'); 
    scanButton[0].addEventListener('click', function() { 
     bridgeit.scan('scan', 'bridgeitCallback'); 
    }); 
}); 

यह मेरे लिए काम कर रहा है:

Answer 3

यहाँ कोड मैं अपने खुद के कार्यक्रम में उपयोग कर रहा हूँ है। मैंने इसे अपने मुख्य नियंत्रक वर्ग के अंत में कोणीय के बाहर जोड़ा है।

आपको अनुभाग को तैयार समारोह में लेने और पृष्ठ पर कहीं भी रखने में सक्षम होना चाहिए।

अद्यतन:

तरीके के कारण वेब ब्राउज़र काम करने के लिए

, अपने वेबपेज रीफ़्रेश कर दिया जाएगा जब आप Bridgeit करने के लिए कॉल से लौटने तो आप किसी तरह की कोई भी जानकारी रखने की जरूरत है स्टोर करने के लिए यह पता लगाने की आवश्यकता होगी।

स्थानीय संग्रहण शायद सबसे अच्छा विकल्प होगा। AmplifyJS लाइब्रेरी ऐसा करने का एक बहुत ही आसान तरीका है।