redirect Angular2 में किसी बाहरी URL पर रीडायरेक्ट कैसे करें




angular2-routing (8)

उपयोगकर्ता को कोणीय 2 में पूरी तरह से बाहरी यूआरएल पर रीडायरेक्ट करने का तरीका क्या है। उदाहरण के लिए, अगर मुझे प्रमाणित करने के लिए उपयोगकर्ता को OAuth2 सर्वर पर रीडायरेक्ट करने की आवश्यकता है, तो मैं यह कैसे करूँगा?

Location.go() , Router.navigate() , और Router.navigateByUrl() उपयोगकर्ता को कोणीय 2 ऐप के भीतर किसी अन्य अनुभाग (मार्ग) में भेजने के लिए ठीक है, लेकिन मैं नहीं देख सकता कि उन्हें रीडायरेक्ट करने के लिए कैसे उपयोग किया जा सकता है एक बाहरी साइट?


समाधान , जैसा कि डेनिस स्मोलेक ने कहा, मृत सरल है। उस URL पर window.location.href सेट करें जिसे आप स्विच करना चाहते हैं और यह बस काम करता है।

उदाहरण के लिए, यदि आपके पास यह घटक आपके घटक की कक्षा फ़ाइल (नियंत्रक) में था:

goCNN() {
    window.location.href='http://www.cnn.com/';
}

फिर आप अपने टेम्पलेट में एक बटन (या जो कुछ भी) पर उचित (click) कॉल के साथ इसे आसानी से कॉल कर सकते हैं:

<button (click)="goCNN()">Go to CNN</button>

मैंने इसे कोणीय 2 स्थान का उपयोग करके किया क्योंकि मैं वैश्विक विंडो ऑब्जेक्ट को अपने आप में हेरफेर नहीं करना चाहता था।

https://angular.io/docs/ts/latest/api/common/index/Location-class.html#!#prepareExternalUrl-anchor

यह इस तरह किया जा सकता है:

import {Component} from '@angular/core';
import {Location} from '@angular/common';
@Component({selector: 'app-component'})
class AppCmp {
  constructor(location: Location) {
    location.go('/foo');
  }
}

आपके घटक में

import { Component } from '@angular/core';

@Component({
  ...
})
export class AppComponent {
  ...
  goToSpecificUrl(url): void {
    window.location.href=url;
  }

  gotoGoogle() : void {
    window.location.href='https://www.google.com';
  }
}

आपके घटक.html में

<button type="button" (click)="goToSpecificUrl('http://.com/')">Open URL</button>
<button type="button" (click)="gotoGoogle()">Open Google</button>

<li *ngFor="item of itemList" (click)="goToSpecificUrl(item.link)"> // (click) don't enable pointer when we hover so we should enable it by using css like: **cursor: pointer;**

मेरे सिर को छीनने के बाद, समाधान सिर्फ http: // से href जोड़ने के लिए है।

<a href="http://www.URL.com">Go somewhere</a>

आप इसका उपयोग कर सकते हैं-> window.location.href = '...';

यह पृष्ठ को जो कुछ भी आप चाहते हैं उसे बदल देगा ..


मैंने window.location.href = ' http: // बाहरी-यूआरएल ' का उपयोग किया;

मेरे लिए रीडायरेक्ट क्रोम में काम किया, लेकिन फ़ायरफ़ॉक्स में काम नहीं किया। निम्नलिखित कोड ने मेरी समस्या का समाधान किया:

window.location.assign('http://external-url');

यदि आप ऑनडिस्ट्री लाइफसाइकिल हुक का उपयोग कर रहे हैं, तो आप window.location.href = को कॉल करने से पहले इस तरह कुछ उपयोग करने में रुचि ले सकते हैं ...

    this.router.ngOnDestroy();
    window.location.href = 'http://www.cnn.com/';

जो आपके घटक में ऑनडिस्ट्री कॉलबैक को ट्रिगर करेगा जो आपको पसंद हो सकता है।

ओह, और यह भी:

import { Router } from '@angular/router';

वह जगह है जहां आप राउटर पाते हैं।

--- संपादित करें --- दुख की बात है, मैं उपरोक्त उदाहरण में गलत हो सकता था। कम से कम यह मेरे उत्पादन कोड में अभी तक अपेक्षित काम नहीं कर रहा है - इसलिए, जब तक मेरे पास आगे की जांच करने का समय न हो, मैं इसे इस तरह हल करता हूं (क्योंकि जब भी संभव हो तो मेरे ऐप को हुक की आवश्यकता होती है)

this.router.navigate(["/"]).then(result=>{window.location.href = 'http://www.cnn.com/';});

हुक को मजबूर करने के लिए मूल रूप से किसी भी (डमी) मार्ग पर रूटिंग, और फिर अनुरोध के रूप में नेविगेट करें।


मुझे आपको लक्ष्य = "_ खाली" की आवश्यकता है , आप window.open का उपयोग कर सकते हैं:

gotoGoogle() : void {
     window.open("https://www.google.com", "_blank");
}




angular2-routing