问题标签 [angular7-router]

我有我的角度应用程序7.1.4在 apache2.4.10服务器上运行。我PathLocationStrategy用来路由我的网址。

这是我的 index.html 文件的一瞥

.htaccess 文件

选项 +FollowSymlinks

重写引擎开启

RewriteCond %{REQUEST_FILENAME} -f [OR]

RewriteCond %{REQUEST_FILENAME} -d

重写规则 ^ - [L]

重写规则 ^ /index.html [L]

问题是，如果我的网址看起来像

阿帕奇重定向到

并且我的目标页面没有显示。

知道我的 URL 都以BASE_URI/app/...

我有一个名为“host”的模块，它有自己的路由，我想将它插入到 app-routing.module 中。但是，我遇到了先加载通配符并显示 PageNotFoundComponent，而不是加载 Host 组件的问题。我有以下文件。

主机模块.ts

应用程序路由.module.ts

app.module.ts

app.component.html

问题：当我运行应用程序并单击“主机”按钮时，它会加载 PageNotFoundComponent。我显然希望它转到 HostComponent。

我的应用程序有点大。它包含许多功能模块，并且大多数都是延迟加载的。我想预加载一个延迟加载的模块，该模块包含在forChild路由中。

为此，我参考了 Angular 文档并按照他们的步骤操作。我提供了下面提到的自定义预加载策略服务。

这是我的自定义预加载策略文件：

应用程序路由文件，

我的 Folder1Module 的路由文件：

因此，当我打开这条路线/page3/sub-page1/data1/data2时，要预加载SubPage2Module 。但这并没有发生。

在此处输入图像描述我的 angular cli 无法正常工作，当我创建新应用程序时，它没有完全运行。C:\Users\ashu>ng 新的应用程序名？您想添加 Angular 路由吗？(y/N) C:\Users\ashu>ng new appname ? 您想添加 Angular 路由吗？(y/N) C:\Users\ashu>

“一个模块到第二个模块导航，无需重新加载整个应用程序”

我已经使用“Window.open”来切换模块，但它重新加载了整个应用程序。我尝试了另一种方法 this.router.navigate & navigateByUrl 它可以工作，但根据新模块侧边栏组件不加载它保持不变。

//它重新加载整个应用程序
window.open("/mfg","_self")

//此方法无需重新加载即可导航到新模块，但其侧边栏未加载
this._router.navigate(["/mfg"])

当我从侧边栏中单击任何模块时，它应该移动到该模块而无需重新加载整个应用程序，并且其侧边栏组件必须根据模块进行更新。

我尝试了三种方法。

第一个：index.html

第二：app.module.ts

第三：app-routing.module.ts

以上所有方法都适用于 URL 路由，我得到了所需的 URL。

http://localhost:4200/客户

但是，静态文件（js 和图像）仍在使用基本路径“ http://localhost:4200/ ”加载。我需要它像http://localhost:4200/customer/main.js 一样。

因此，出于某些安全验证原因，我尝试将其设为http://localhost:4200/customer/main.js而不是http://localhost:4200/main.js 。

在下面的屏幕截图中可以看到相同的内容。

根据我对组件之间数据通信的理解，我们可以通过@input()、@output() 以及制作一个通用的广播服务来实现。

我相信服务是 @input 和 @output 的最佳方式，具体取决于各种条件，例如

1. 文件夹结构应该像嵌套结构一样处于父子模式。

2. 我们不能将@output 用于正在处理的组件，因为我们从未找到它的选择器。

3. 我们也不能将@input & @output 用于非父/子组件。

所以更好的是做一个通用的通信服务，这样我们甚至可以在同级组件（​​不是父子）和子父组件之间进行通信。

所以请我需要你所有的意见，我在这里还是更好的方式？

我的意图是创建本文详述的打印模块。加载我的 app.component.html 时出现以下错误：

App.component.html

应用组件.ts

打印服务.ts

样式.css

您能否让我知道我必须进行哪些更改才能使其正常工作？

我正在为我的前端 angular ionic 应用程序使用 ion-tabs。我正在使用嵌套选项卡，所以第一个离子选项卡有 3 个选项卡，选项卡 1、选项卡 2、功能选项卡和功能选项卡有 3 个选项卡，选项卡 4、选项卡 5、选项卡 6。我使用了 Angular 路由。

所以路线如下所示：

1. 选项卡/选项卡1，
2. 标签/标签2，
3. 选项卡/功能选项卡/tab4，
4. 选项卡/功能选项卡/tab5，
5. 选项卡/功能选项卡/tab6

选择 feature-tabs 时的问题 Tab 4 默认情况下是活动路由，但 ion-tab-button 中的属性“tab”与路由中的路径（即 tab =“tab4”）保持相似时默认推荐选项卡 4 有效，但选择/单击选项卡会出现无法匹配任何路线的错误。URL 段：'tabs/tab1'。这意味着 ion-tab-button 的 'tab' 属性是指父选项卡。当我将 ion-tab-button 中的属性“tab”更改为“feature-tabs/tab4”（不推荐）时，一切正常，但 ion-tab-button 的 --color-selected CSS 属性不起作用. 但我的问题是为什么 tab 属性指的是专利选项卡，我如何才能引用子功能选项卡？

我已经厌倦了更改 CSS 属性，但它根本不起作用，

这是我的标签路由，

这是标签 html，

这是我的功能选项卡路线：

这是功能选项卡的 html：

我在 angular 7 和 ionic 4 上创建了一个应用程序。我尝试编辑 app.routing.ts 文件，设置路径和组件。从那时起，我在下面收到此错误：