innerHTML中的Angular 2特定代码

我正在构建一个Angular 2移动站点，该站点位于一个较旧的系统之上，我从这个系统为web服务提供了html。innerHTML中的Angular 2特定代码

在服务的html中，有链接将转到我的新应用程序中的角页面。我目前使用<div [innerHTML]="serverDoc"></div>来呈现html。

是否有可能在我的服务器端html中添加一个(click)="goToPageX()"，然后让它在我的类型脚本类中调用一个函数，以便我可以通过角度2路由器将用户路由到正确的页面？

是否需要这样做？即使没有通过角度2路由器，简单的链接到正确的URL会保持导航历史不变吗？

2016-09-20 staffang

如果您想使用路由器，您可以将routerLink指令添加到您的按钮或链接。您需要事先设置您的路线。

<button routerLink="/link/toPage">Go to page</button>

如果您想以编程方式进行路由，您可以使用路由器的导航功能。

import { Router } from @angular/router 

@Component({ 
    selector: 'my-app', 
    template: '<button (click)="goToPage()">Go to page</button>' 
}) 
export class AppComponent { 
    constructor(private _router: Router){ } 

    goToPage(){ 
     this._router.navigate("/link/toPage"); 
    } 
}

更多的angular2的router documentation。

-------------- --------------编辑

如果你想用一个按钮去一个链接，你可以通过使用window.location.href在JavaScript中完成。这也适用于链接到角度位置，如果你在它之外。

<html> 
    <head> 
     <script> 
      function goToPage(){ 
       window.location.href = "http://www.google.com"; 
      } 
     </script> 
    </head> 
    <body> 
     <button onclick="goToPage()">google</button> 
    </body> 
</html>

来源

2016-09-20 20:44:39

这些替代方法将无法正常工作，因为我将html添加到组件的[innerHTML]中，我无法连接到角码。哪些游戏我的第一个问题，关于添加（点击）到我的HTML，它不会工作... – staffang

不，'（点击）'不能工作，因为这将需要角运行。如果你想使用普通html/js中的按钮转到页面，可以使用'window.location.href'来完成。我编辑了我的答案，包括一个简单的例子。 –

innerHTML中的Angular 2特定代码

回答

相关问题