angular.js लिंक व्यवहार - विशिष्ट यूआरएल

के लिए गहरी लिंकिंग अक्षम करें मेरे पास HTML5 मोड सक्षम के साथ एक Angular.js ऐप काम कर रहा है।angular.js लिंक व्यवहार - विशिष्ट यूआरएल

$location.Html5mode(true).hashbang("!");

मैं क्या हासिल करना चाहते हैं पता पट्टी में URL में बदलाव एचटीएमएल 5 इतिहास एपीआई का उपयोग कर और कोणीय नियंत्रकों का उपयोग कर इसे से निपटने के बजाय सामान्य ब्राउज़िंग व्यवहार करने के लिए कुछ यूआरएल या <a> टैग प्राप्त करने के लिए है।

मैं इस लिंक:

<a href='/auth/facebook'>Sign in with Facebook</a> 
<a href='/auth/twitter'>Sign in with Twitter</a> 
<a href='/auth/...'>Sign in with ...</a>

और मैं ब्राउज़र /auth/... तो उपयोगकर्ता तब एक प्रमाणीकरण सेवा करने के लिए पुनः निर्देशित किया जाएगा करने के लिए उपयोगकर्ता रीडायरेक्ट करना चाहते हैं।

क्या कोई तरीका है कि मैं ऐसा कर सकता हूं?

स्रोत

2012-07-20 Vlad V

117

कोणीय 1.0.1 में target="_self" काम करता है जोड़ना:

<a target="_self" href='/auth/facebook'>Sign in with Facebook</a>

यह सुविधा प्रलेखित है (https://docs.angularjs.org/guide/$location - '_self' के लिए खोज)

यदि आप जिज्ञासु हैं, कोणीय को देखो स्रोत (रेखा 5365 @ v1.0.1)। क्लिक अपहरण केवल तब होता है जब !elm.attr('target') सत्य है।

स्रोत

2012-08-08 04:56:28 Nik

कोणीय 1.2.16 के साथ काम करता है और वर्तमान मास्टर https://github.com/angular/angular.js/blob/master/src/ng/location.js#L687 –

के साथ संभवतः बहुत साफ है! –

को रेल मार्गों को कोणीय मार्गों में परिवर्तित करते समय एक संक्रमण अवधि को सक्षम करने के लिए इसका उपयोग करना पड़ा – Mikey

मैंने कोणीय के साथ कुछ बार एक ही समस्या में भाग लिया है, और जब मैं दो कार्यात्मक समाधानों के साथ आया हूं, दोनों हैक की तरह महसूस करते हैं और बहुत "कोणीय" नहीं होते हैं।

हैक # 1:

बाइंड लिंक के click घटना के लिए एक window.location ताज़ा।

<a 
    href=/external/link.html 
    onclick="window.location = 'http://example.com/external/link.html';" 
>

इस दृष्टिकोण के साथ नकारात्मकता और समस्याएं काफी स्पष्ट हैं।

हैक # 2

सेटअप कोणीय $route रों कि एक $window.location परिवर्तन प्रदर्शन करते हैं।

// Route 
.when('/external', { 
    templateUrl: 'path/to/dummy/template', 
    controller: 'external' 
}) 

// Controller 
.controller('external', ['$window', function ($window) { 
    $window.location = 'http://www.google.com'; 
}])

मैं कल्पना आप $routeParams या क्वेरी स्ट्रिंग का उपयोग कर एक नियंत्रक संभाल सब "बाहरी" लिंक करने के लिए इस का विस्तार कर सकते हैं।

जैसा कि मैंने कहा था, इनमें से कोई भी समाधान बहुत संतोषजनक नहीं है, लेकिन यदि आपको इसे अल्प अवधि में काम करना होगा, तो वे मदद कर सकते हैं।

एक तरफ ध्यान दें, मैं वास्तव में इस प्रकार की कार्यक्षमता के लिए कोणीय समर्थन rel=external देखना चाहता हूं, जैसे jQueryMobile इसका उपयोग AJAX पृष्ठ लोडिंग को अक्षम करने के लिए करता है।

स्रोत

2012-07-20 15:39:56

मैं देखना 'rel = external' भी काम कर करना चाहते हैं। तब तक, मैं ** हैक # 2 ** का उपयोग करूंगा। मैं आपके उत्तर को जल्द ही स्वीकार्य रूप से चिह्नित कर दूंगा लेकिन मैं यह देखने के लिए थोड़ी देर इंतजार करना चाहूंगा कि किसी ने इसे और अधिक _angular-ish way_ में हल किया है या नहीं। धन्यवाद! –

मेरे पास समान विचार थे, विशेष रूप से 'html5mode = true' में रीफ्रेश करने के लिए '$ window.location' का उपयोग करके- यह वेबकिट ब्राउज़र में ठीक से काम नहीं करता है; निश्चित रूप से 'target = _self' का उपयोग करें। – jlmakes

अपने मार्गों में प्रयास करें:

$routeProvider.otherwise({})

स्रोत

2012-07-20 20:57:06

काम नहीं करता है। केवल अगर मैं नूह के जवाब से बाहरी नियंत्रक का उपयोग करता हूं। –

यह गहरी बंद करने से सभी को एक साथ जोड़ने के लिए कोड है। यह rootElement से क्लिक इवेंट हैंडलर को अक्षम करता है।

angular.module('myApp', []) 
    .run(['$location', '$rootElement', function ($location, $rootElement) { 
     $rootElement.off('click'); 
}]);

स्रोत

2012-08-02 20:26:10 Fran6co

यह एक मिश्रित एमवीसी/कोणीय साइट के लिए एक अच्छा समाधान है जहां कुछ लिंक मिनी-एसपीए के लिए होते हैं जिन्हें कोणीय मार्ग कॉन्फ़िगर द्वारा अवरुद्ध किया जाता है, फिर भी अन्य लिंक नियमित एमवीसी पृष्ठ अनुरोधों के लिए होते हैं। मेरे मामले में जब तक एक कोणीय नियंत्रक लोड नहीं किया गया था तब तक नियमित लिंक काम करते थे (जब एसपीए का उपयोग किया जाता था), जिस बिंदु पर नियमित एमवीसी लिंक अपहरण किए गए थे और कोई प्रतिक्रिया नहीं मिली थी। तो ऊपर उठाया। – Sean

जो भी आप '$ location' डालते हैं, आपको यह करने की आवश्यकता होगी: उदा। एक 'नियंत्रक (' fooController ', फ़ंक्शन ($ स्थान) {})' आपको '.controller (' fooController ', फ़ंक्शन ($ तत्व, $ स्थान) {$ element.off (' क्लिक 'जैसी घटनाओं को हटाने की आवश्यकता होगी। ');}) '। – tester

धन्यवाद, मैं पृष्ठ पर फ़िल्टर लागू करते समय यूआरएल सेट करने के लिए पुशस्टेट का उपयोग कर रहा हूं। इसके साथ में मैं '$ location.search()' का उपयोग कर सकता हूं और अभी भी मेरे '' टैग सामान्य रूप से कार्य कर सकते हैं। (हर जगह 'target =" _ self "लागू करने के बिना) – tomvo

Nik का जवाब बंद करने के लिए, आप लिंक के बहुत सारे है और उनमें से हर एक में लक्ष्य जोड़ना नहीं चाहते हैं तो, आप एक निर्देश का उपयोग कर सकते हैं:

Module.directive('a', function() { 
    return { 
     restrict: 'E', 
     link: function(scope, element, attrs) { 
      element.attr("target", "_self"); 
     } 
    }; 
});

स्रोत

2014-09-10 18:22:08 Dragonfly

Dragonfly के जवाब देने के लिए जोड़ने के लिए, लक्ष्य = "_ self" विशेषताओं की संख्या को सीमित करने के लिए मैंने पाया है कि एक सर्वोत्तम अभ्यास कभी शरीर टैग पर एनजी-एप विशेषता डालता है। ऐसा करके आप कोणीय को बता रहे हैं कि शरीर टैग के भीतर सब कुछ कोणीय ऐप का हिस्सा हैं।

यदि आप एक स्थैतिक आवरण के भीतर काम कर रहे हैं जो कोणीय से प्रभावित नहीं होना चाहिए, तो अपने एनजी-एप विशेषता को एक div (या अन्य तत्व) पर रखें जो केवल आपके स्थान पर घूमने वाला स्थान है, यह आपके कोणीय ऐप में काम करने जा रहा है। जिस तरह से आपको केवल लिंक पर लक्ष्य = '_ self' विशेषता डालना होगा जो ng-app तत्व के बच्चे होंगे।

<body> 
    ... top markup ... 
    <div ng-app="myApp"> 
     <div ng-view></div> 
    </div> 
    ... bottom markup ... 
</body>

स्रोत

2014-10-14 23:00:47 risingfish

Fran6co की विधि के लिए एक वैकल्पिक $ locationProvider में 'rewriteLinks' विकल्प को अक्षम करने के लिए है:

$locationProvider.html5Mode({ 
    enabled: true, 
    rewriteLinks: false 
});

यह $ rootElement.off बुला के रूप में वास्तव में इसी कार्य को पूरा करेगा ('क्लिक') , लेकिन अन्य जावास्क्रिप्ट में हस्तक्षेप नहीं करेगा जो आपके ऐप के रूट तत्व पर क्लिक ईवेंट को संभालता है।

docs देखें, और relevant source

स्रोत

2015-02-19 03:18:24 ZMan9854

प्लस इसे सभी को चिह्नित करें – sidonaldson

यह मेरे लिए काम नहीं करता है, लेकिन @ फ्रैंकको का [समाधान] (http://stackoverflow.com/a/11785196/295686) लगभग करता है (मेरी टिप्पणी देखें)। मैं इसे उस पृष्ठ पर चला रहा हूं जो ऐप लोड करता है लेकिन कोई नियंत्रक उस पेड़ को लक्षित करता है जिसमें एंकर टैग है। – mlhDev

+1 इस उत्तर के लिए। यह तब तक नहीं था जब तक मैं $ 5 पर html5Mode सक्षम नहीं करता था, यह सुनिश्चित करें कि समस्या पहली जगह सामने आई थी। –

angular.js लिंक व्यवहार - विशिष्ट यूआरएल

उत्तर

संबंधित मुद्दे