[英]Can't bind to 'href' since it isn't a known native property
我是Angular 2的新手,我正在關注Udemy的這個課程。
現在我想將我的項目升級到候選發布版本,我遇到了一個我無法在網上找到的錯誤。
在我的主題中我有這樣的事情:
import {bootstrap} from '@angular/platform-browser-dynamic';
import {Component, OnInit, provide} from '@angular/core';
import {RegistrationComponent} from '../src/register/registratration.component.ts'
import {ROUTER_DIRECTIVES, ROUTER_PROVIDERS, Routes, Route, Router} from "@angular/router";
import {TempComponent} from "../src/register/temp.component.ts";
import {WorkComponent} from "../src/work/work.component.ts";
import {OrderComponent} from "../src/order/order.component.ts";
import {SignInComponent} from "../src/sign-in/sign-in.component.ts";
import {APP_BASE_HREF, HashLocationStrategy, LocationStrategy, Location} from '@angular/common';
///<reference path="/assets/jquery.d.ts" />
import jQuery = require('jquery');
@Component({
selector: 'my-app',
templateUrl: './src/app.component.html',
directives:[RegistrationComponent, TempComponent, WorkComponent, OrderComponent, SignInComponent, ROUTER_DIRECTIVES]
})
@Routes([
{path:'/temp', name: 'Temp', component: TempComponent},
{path:'/registration', name:'Registration', component: RegistrationComponent},
{path: '/work', name:'Work', component: WorkComponent},
{path: '/order', name:'Order', component: OrderComponent},
{path: '/sign-in/...', name:'Sign-In', component: SignInComponent}
// new AsyncRoute({
// path: '/lazy',
// loader: () => ComponentHelper.LoadComponentAsync('LazyLoaded','./components/lazy-loaded/lazy-loaded'),
// name: 'Lazy'
// })
])
export class AppComponent implements OnInit{
public clicked:boolean;
constructor(private router: Router) {}
// //new router
// router:Router;
// location: Location;
// constructor(router:Router, location:Location)
// {
// this.router = router;
// this.location = location;
// }
//
// getLinkStyle(path)
// {
// return this.location.path() === path;
// }
ngOnInit():any {
this.router.navigate([null]);
this.clicked =false;
console.log('on init');
}
public onClick($event:Event){
if(this.clicked)
{
this.clicked = false;
}
else{
this.clicked = true;
}
}
}
bootstrap(AppComponent,[ provide(APP_BASE_HREF, { useValue: "/" }),
ROUTER_PROVIDERS,
provide(LocationStrategy, {useClass: HashLocationStrategy})]);
在我的app.component.html中,我有
<h1>Sample</h1>
<nav>
<button [routerLink]="['/Registration']">Register</button>
<button [routerLink]="['/Temp']">Temporary</button>
<button [routerLink]="['/Sign-In', 'Sign-In-Form']">Sign-In</button>
<button [routerLink]="['/Temp']">Temporary</button>
</nav>
<router-outlet></router-outlet>
我得到的錯誤是這樣的:
EXCEPTION: Error: Uncaught (in promise): Template parse errors:
Can't bind to 'href' since it isn't a known native property ("
<nav>
<!--<button [routerLink]="['/Registration']"></button>-->
[ERROR ->]<button routerLink="['/Registration']">Register</button>
<!--<button [routerLink]="['/Registrati"): AppComponent@4:4
有沒有人遇到過這種情況,我該如何解決呢? 我將不勝感激任何幫助。
先感謝您。
不確定這會解決問題,但是,嘗試使用超鏈接代替按鈕,
<a [routerLink]="['/Registration']">Register</a>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.