本文将介绍URL哈希爆炸的详细情况，特别是关于＃！/前缀而不是Angular1.6中的简单哈希的相关信息。我们将通过案例分析、数据研究等多种方式，帮助您更全面地了解这个主题，同时也将涉及一些关于Ang

本文将介绍URL哈希爆炸的详细情况，特别是关于＃！/前缀而不是Angular 1.6中的简单哈希的相关信息。我们将通过案例分析、数据研究等多种方式，帮助您更全面地了解这个主题，同时也将涉及一些关于Angular 2从网址中删除哈希（＃）、Angular 2单击ngClass,如何仅应用于SELF而不是ALLF中的所有元素、angular – 如何使用UI-Router阻止持久性URL锚链接哈希值？、Angular 下载属性重定向到 url 而不是下载的知识。

• URL哈希爆炸（＃！/）前缀而不是Angular 1.6中的简单哈希（＃/）（url_hash）
• Angular 2从网址中删除哈希（＃）
• Angular 2单击ngClass,如何仅应用于SELF而不是ALLF中的所有元素
• angular – 如何使用UI-Router阻止持久性URL锚链接哈希值？
• Angular 下载属性重定向到 url 而不是下载

URL哈希爆炸（＃！/）前缀而不是Angular 1.6中的简单哈希（＃/）（url_hash）

我上AngularJS网址项目已经从改变localhost:3000/admin#/到localhost:3000/admin#!/自上次我在我的项目工作…

在网络上找不到任何东西，有人知道这是什么吗？

答案1

它是AngularJS 1.6的新增功能，它添加了新的哈希前缀。

由于aa077e8，用于$location哈希爆炸URL的默认哈希前缀已从空字符串（''''）更改为爆炸（''!''）。如果您的应用程序不使用HTML5模式或正在不支持HTML5模式的浏览器上运行，并且您尚未指定自己的哈希前缀，则客户端URL现在将包含一个!前缀。例如，mydomain.com/#/a/b/cURL将变为
mydomain.com/#!/a/b/c。

如果要删除此前缀，请将以下代码添加到配置中：

appModule.config([''$locationProvider'', function($locationProvider) {  $locationProvider.hashPrefix('''');}]);

Angular 2从网址中删除哈希（＃）

我正在尝试从Angular 2中的网址中删除＃号，但找不到如何在不产生任何问题的情况下删除它的任何好的解释。

我记得在AngularJS 1上添加起来比较容易 $locationProvider.html5Mode(true);

如果您能告诉我这是否是一种好的做法（删除＃）或可能会影响应用程序的SEO（或对其进行改进），我也将不胜感激。

PS：我正在将Angular 2与打字稿一起使用

答案1

正如@Volodymyr Bilyachat指出的那样，这PathLocationStrategy是Angular2中的默认位置策略，并且如果#url中存在，则一定是在某处被覆盖了。

在模块提供程序旁边，检查模块导入，也可以通过提供{ useHash: true }作为第二个参数来覆盖它RouterModule.forRoot：

imports: [    ...    RouterModule.forRoot(routes, { useHash: true })  // remove second argument]

另请注意，在使用时，PathLocationStrategy您需要配置Web服务器index.html以为所有请求的位置提供服务（应用程序的入口点）。

Angular 2单击ngClass,如何仅应用于SELF而不是ALLF中的所有元素

<divng-repeat="let card of cards">
<divng-ng-click="isflipped = !isflipped">
</div>
</div>

<div*ngFor="let card of cards">
<div[ngClass]="{'flipped': isflipped }" (click)="isflipped = !isflipped;">
</div>
</div>

<div*ngFor="let card of cards">
    <div[ngClass]="{'flipped': card.isflipped }" (click)="card.isflipped = !card.isflipped;">
    </div>
</div>

angular – 如何使用UI-Router阻止持久性URL锚链接哈希值？

export let derpState: Ng2StateDeclaration = {
    name: 'derpState',component: DerpComponent,url: '/derp'
}

import { ModuleWithProviders }  from '@angular/core';
import { Routes,RouterModule } from '@angular/router';

import { DerpComponent }    from './derp.component';

const derp: Routes = [
{ path: 'derp',component: DerpComponent }
];
export const derpState: ModuleWithProviders = RouterModule.forChild(derp);

Angular 下载属性重定向到 url 而不是下载

      public getCiCdInputFromUser(value: any) {

    this.userService.getCicdFile(value).subscribe((test => {

      this.specificationUrl = test;
      console.log(test);
    }));

      }

        <a
    mat-raised-button
    color="accent"
    [href]="specificationUrl"
    download="specificationUrl"
  >
    Download CICD File
  </a>

      getCicdFile = (language: string): Observable<Cicdlanguage> => {
    const headers = new HttpHeaders().set(''Content-Type'',''text/plain; charset=utf-8'');
    return this.http
      .post<Cicdlanguage>(`${environment.apiUrl}/cicd`,{language},{ headers,responseType: ''text'' as ''json''  })
      .pipe(
        catchError(err => {
          console.log(''error'',err);
          return EMPTY;
        })
      );
  }

    export class Cicdlanguage {
  public language: string;
}