Question

我使用Angular7做一个Angular应用，我尝试使用两个“ router-outlet”标签，例如，我有两个组件“ main”和“ main2”，它们的一半相同，它们在父组件中路由，并且我想在两个“子组件”中路由它们的差异，这可能吗？你有什么探索的方法吗？谢谢;）

Answer 1

好吧，如果我能很好地理解您的问题。例如，很可能在您具有登录名和仪表板的情况下

//  ViewController.swift
//  SellOutControl
//
//  Created by Gaetano on 17/05/2019.
//  Copyright © 2019 Abacus System. All rights reserved.
//

import UIKit
import WebKit

class ViewController: UIViewController, WKUIDelegate{ //<--added WKUIDelegate here to properly handle the UIDelegate below

    private weak var webView: WKWebView?
    private lazy var url = URL (string: "https://app.selloutcontrol.com")!

    func initWebView(configuration: WKWebViewConfiguration) {
        if webView != nil { return }
        let webView = WKWebView(frame: UIScreen.main.bounds, configuration: configuration)
        webView.uiDelegate = self
        view.addSubview(webView)
        self.webView = webView
    }

    override func viewWillAppear(_ animated: Bool) {
        super.viewWillAppear(animated)
        if webView == nil { initWebView(configuration: WKWebViewConfiguration()) }
        webView?.load(url: url)
    }

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.


        let refresh = UIBarButtonItem(barButtonSystemItem: .refresh, target: webView, action: #selector(webView?.reload))
        let backButton = UIBarButtonItem(title: "<", style: .plain, target: self, action: #selector(goBack) )
        let forwardButton = UIBarButtonItem(title: ">", style: .plain, target: self, action: #selector(goForward) )
        toolbarItems = [backButton, refresh, forwardButton]
        navigationController?.isToolbarHidden = false
    }

    @objc private func goBack() {
        if webView!.canGoBack {
            webView?.goBack()
        } else {
            self.dismiss(animated: true, completion: nil)
        }
    }
    @objc private func goForward() {
        if webView!.canGoForward {
            webView?.goForward()
        } else {
            self.dismiss(animated: true, completion: nil)
        }
    }
}
    extension ViewController{ //<--changed this declaration

    func webView(_ webView: WKWebView, createWebViewWith configuration: WKWebViewConfiguration, for navigationAction: WKNavigationAction, windowFeatures: WKWindowFeatures) -> WKWebView? {
    // push new screen to the navigation controller when need to open url in another "tab"

        if let url = navigationAction.request.url, navigationAction.targetFrame == nil {
            let viewController = ViewController()
            viewController.initWebView(configuration: configuration)
            viewController.url = url
            DispatchQueue.main.async { [weak self] in
         self?.navigationController?.pushViewController(viewController, animated: true)
            }
            return viewController.webView
        }
        title = webView.url?.host
        return nil
        }
    }

    extension WKWebView {
        func load(url: URL) { load(URLRequest(url: url)) }
    }

导入每个组件并引用正确的路径

Answer 2

对于那些与我有相同问题的人，我使用“主”组件和“认证”组件。 “主要”组件包含“ router-outlet”标签，而我的“ auth”组件包含我的登录视图。在我的app.componnt.html中，我只使用

<app-auth *ngIf="!isAuth"></app-auth>
<app-main *ngIf="isAuth"></app-main>

使用该方法，任何想要访问特殊路径的用户都不会重定向到身份验证视图，并且会保留他要访问的路径。

是否可以在角度使用两条路线？

2 个答案: