当前位置: 首页 > 面试题库 >

角度ui路由器父网址设置为/

班经亘
2023-03-14
问题内容

使用ui-
router并将父状态URL设置为/导致我的URL看起来像localhost:8000/#//child在查看子页面时一样。我只想/在散列和子项之间添加一个。

我尝试将父状态网址保留为空白,但是使用锚链接时,ui-sref不会链接回父状态。有人知道使用根级别未命名的父URL的解决方案吗?

app.config

app.config(function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise("/");

$stateProvider
  .state("main", {
    url: "/",
    templateUrl: 'sites/main/main.html',
    controller : 'MainController',
    resolve: {
      items: function(srvMenu) {
          return srvMenu.getNav();
      }
  }

 })

});

child.config

emergency.config(function($stateProvider) { 
$stateProvider
    .state("main.emergency", {
      url: "/emergency",
      templateUrl: 'sites/emergency/emergency_menu.html',
      controller : 'EmenuController',
      resolve: {
          emenu: function(srvEmergency) {
              return srvEmergency.getMenu();
          }
      }

    })

    .state("main.emergency.detail", {
      url: "/detail",
      templateUrl: 'sites/emergency/emergency_detail.html',
    })
});

问题答案:

ui-router有解决方案 _(几乎)_任何东西。有一个工作的plnkr。我们将要使用的功能称为:绝对路线(^)

因此,让我们从需求开始,拥有以下URL路由:

domain/#/                             -- root for main
domain/#/emergency/                   -- main.emergency
domain/#/emergency/detail             -- main.emergency.detail

使用此ui-sref状态调用时哪个应该工作:

<ul>
    <li><a ui-sref="main">Main</a></li>
    <li><a ui-sref="main.emergency">Emergency</a></li>
    <li><a ui-sref="main.emergency.detail">Detail</a></li>
</ul>

现在,诀窍是:

  • (第一) 状态必须使用url: "/",以具有一些唯一标识
  • 但是下一个状态可以再次从根开始定义:使用此设置:
    url: "^/..."

这是状态配置,可实现所需的结果

  $stateProvider
    // root with '/'
    .state("main", {
      url: "/",
      templateUrl: 'main.tpl.html',
    })
    // here we start again from the root '/emergency'
    .state("main.emergency", {
      url: "^/emergency",
      templateUrl: 'emergency_menu.tpl.html',
    })
    // parent and child '/emergency/detail
    .state("main.emergency.detail", {
      url: "/detail",
      templateUrl: 'emergency_detail.tpl.html',
    });

这是文档:

[绝对路线(^)](https://github.com/angular-ui/ui-router/wiki/URL-

Routing#absolute-routes-)

…还有正在工作的 pl夫 …



 类似资料:
  • 问题内容: 角度ui路由器的示例演示在起始页面具有以下链接: “ ui-router”的完整网址为或 “关于”的完整网址为或 当我使用durandalJS时,存在一个限制,即默认URL只是“ /”,不能有“ / ui-router”。 Angular ui路由器插件有相同的限制吗? 问题答案: 请参阅此处,默认路由有一个“其他”选项。

  • 问题内容: 我想用以下结构构建一个站点header-view,main-view,footer- view。因此,我定义了一个包含页眉和页脚的根路由。root的子代将是我的全部站点。在这些站点中,我将拥有更多的嵌套视图。 在下面的代码中,它确实显示了页眉,但未显示页脚和主视图。一旦删除父级继承,它将显示主视图,但不显示页眉和页脚。 的HTML JS 问题答案: 有一个与正在工作的矮人有关的链接。

  • 问题内容: 是否可以在 AngularJS 应用中向所有路由添加 基本URL ?本质上是更改其在服务器上的位置(如果可以的话,可以改变它的位置,因此可以通过而不是通过进行访问)。 __ 为了添加一些上下文,我正在尝试将现有的 Angular 应用放置在某种身份验证后面,以便成功登录后可以在该地址访问该应用。 问题是,如果我要在正常运行时加载应用程序(服务器显然会显示正确的页面),但是单击任何链接将

  • 应用程序模块: app-routing.module.ts: 实体/实体-routing.module.ts: 实体/实体.组件. ts: 我还尝试使用以下方法在实体模块中定义路由,但组件仍会显示为导航到 /list,而不是 /entities/list。 我做错了什么?任何帮助是值得赞赏的!

  • 问题内容: 我有以下情况: index.html页面加载有角并包含:ui-view layout.html页面包含左侧菜单,该菜单可解析来自服务器的数据 homepage.html使用layout.html作为其父项,但需要从服务器解析其自己的数据。 问题是:当我解决父问题时,孩子无法解决问题;当我删除父问题时,孩子解决问题。 您能帮我,让我知道我做错了吗? app.js 问题答案: 一项功能应同

  • 问题内容: 我刚刚升级到从和我已经注意到,状态改变时,滚动位置跳到德子的顶部是新状态的主题。 很好,但是我有两个问题: 1)我在页面顶部和之间填充了30px的空白,我希望它滚动到页面顶部,并留出一定的空隙。目前,它正好到达看起来难看的顶部。为此,我想我要么需要知道如何使其滚动到ui视图所在的div的顶部(而不是浏览器),要么我需要找出如何重写才能滚动到负30px 。 我已经尝试过,但是如果这样做,