The <base href=”/”/> you define will determine how all other assets you plan on loading treat their relative paths. While you’ll most often use / as your base href, it’s important to understand what’s going on in case you need to change how you’re hosting your project.

If the base href is not set, app will have error. The easiest way to do it set base href in html:

<!doctype html>

<html>

<head>

  <meta charset="utf-8">

  <title>WikiSearch</title>

  <base href="/">

  <meta name="viewport" content="width=device-width, initial-scale=1">

  <link rel="icon" type="image/x-icon" href="favicon.ico">

</head>

<body>

  <app-root>Loading...</app-root>

</body>

</html>

Sometimes though, coders of an Angular application don’t have access to the head section of the
application HTML. This is true for instance, when reusing headers and footers of a larger, preexisting
application.
Fortunately there is a workaround for this cases. You can declare the application base path
programmatically, when bootstrapping the Angular application:

@NgModule({

  declarations: [

    AppComponent

  ],

  imports: [

    appRoutes,

    BrowserModule,

    FormsModule,

    HttpModule,

    JsonpModule,

    SharedServiceModule.forRoot()

  ],

  providers: [

    {provide: APP_BASE_HREF, useValue: '/'},

    {

      provide: API_URL,

      useValue: `https://en.wikipedia.org/w/api.php?callback=JSONP_CALLBACK`

    }

  ],

  bootstrap: [AppComponent]

})

export class AppModule { }

[Angular2 Router] Understand the Angular 2 Base href Requirement的更多相关文章

  1. [Angular2 Router] Exiting an Angular 2 Route - How To Prevent Memory Leaks

    In this tutorial we are going to learn how we can accidentally creating memory leaks in our applicat ...

  2. [Angular2 Router] Lazy Load Angular 2 Modules with the Router

    Angular 2 lazy loading is a core feature of Angular 2. Lazy loading allows your application to start ...

  3. [Angular2 Form] Understand the Angular 2 States of Inputs: Pristine and Untouched

    Angular 2’s ngModel exposes more than just validity, it even gives you the states of whether the inp ...

  4. [Angular2 Router] Resolving route data in Angular 2

    From Article: RESOLVING ROUTE DATA IN ANGULAR 2 Github If you know Anuglar UI router, you must know ...

  5. [Angular2 Router] Auxiliary Routes bit by bit

    Article Github Auxiliary Routes is is little bit hard to understand. Here is demo, link You can see ...

  6. JSP中<base href="<%=basePath%>">作用

    通常在JSP页面开通有如下代码: <% String path = request.getContextPath(); String basePath = request.getScheme() ...

  7. <base href="<%=basePath%>

    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"% ...

  8. JSP中<base href="<%=basePath%>">的作用

    来源于:http://fanshuyao.iteye.com/blog/2097229 首先了解是什么是<base href=""> <base href=&qu ...

  9. JSP页面中 <base href="<%=basePath%>">

    base标记是一个基链接标记,是一个单标记.用以改变文件中所有连结标记的参数内定值.它只能应用于标记<head>与</head>之间.你网页上的所有相对路径在链接时都将在前面加 ...

随机推荐

  1. Visual Studio 2010+Oracle 10g +NHibernate配置

    南京酷都面试,考官问:你知道NHibernate吗?瞬间我就急了:只听说过Hibernate,NHibernate是什么?还有其他问题也是不知道,所以后果就悲剧了. 自己做一个小系统,总是想如果数据量 ...

  2. 棒棒的毛笔字PS教程

    跟大家分享一下毛笔字怎么做出来的,主要通过字体和素材叠加,十分简单,喜欢的一起练习.做完记得交作业. 先看看最终效果: 在网上是不是经常看这些碉堡了的毛笔感觉是不是很羡慕啊,现在我就教大家怎么做出这样 ...

  3. Linux下如何进行FTP设置

    一.Redhat/CentOS安装vsftp软件 1.更新yum源 首先需要更新系统的yum源,便捷工具下载地址:http://help.aliyun.com/manual?spm=0.0.0.0.z ...

  4. android 运行 python

    Jython is an implementation of the Python programming language designed to run on the Java platform. ...

  5. openstack network

  6. OSPF虚链路配置.示例2

    先看一个拓扑图 黄色区域是area0,即骨干区域,如果如图示RT1与RT6之间的链路断了,那么会出现骨干区域被“分裂”的情况,很明显骨干区域是不能被分割开的,出现这种状况的时候可能会影响到整个自制系统 ...

  7. Redis初步

    Redis目录下文件: redis-server.exe:服务程序 redis-check-dump.exe:本地数据库检查 redis-check-aof.exe:更新日志检查 redis-benc ...

  8. 关于JPA封装数据库数据到实体不调用属性的get和set的方法解决办法

    今天发现JPA封装数据库数据到实体并不调用属性的get和set的,郁闷,本来想在set方法做改字段的值处理的谁知道遇到这个情况: @Column(name = acode) @Access(value ...

  9. android打电话、发短信实现

    打电话: Intent intent = newIntent(Intent.ACTION_CALL,Uri.parse("tel:"+"156666666666" ...

  10. The_Last_Geass

    我在此立下最终的Flag,为了让它保持在第一条我不会再发任何说说:从吃晚饭开始心情就有些崩溃,感觉毫无希望.一直到现在三个多小时吧,想了很多写了很多也跑了两圈步,也许明白了些什么. 现在1月,距离省选 ...