无法读取未定义的 属性 'isXXXXX'
Cannot read property 'isXXXXX' of undefined
我正在尝试在我的一个组件上使用共享服务。当我与应用程序根组件一起使用时,它工作正常。当我尝试在另一个 module/dashboard 上使用时,出现错误。
shared/authorize.service.ts
@Injectable()
export class AuthorizationService {
isDoingSomething() {
return "Some Boolean value";
}
}
dashboard/header/header.component.ts
@Component({
selector: 'app-header',
templateUrl: './header.component.html',
styleUrls: ['./header.component.css']
})
export class HeaderComponent {
constructor(private _auth: AuthorizeService,
private _router: Router) { }
}
dashboard/header/header.component.html
<mat-toolbar color="primary" role="heading">
<div fxFlex fxLayout fxLayoutAlign="flex-end">
<ul fxLayout fxLayoutGap="10px" class="navigation-items">
<li routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}">
<a routerLink="/home">Home</a>
</li>
<li routerLinkActive="active">
<a *ngIf="_auth.isDoingSomething()" routerLink="/docall">Rest Call</a>
</li>
</ul>
</div>
</mat-toolbar>
**HeaderComponent.html:6 ERROR TypeError:** Cannot read property 'isDoingSomething' of undefined
at Object.eval [as updateDirectives] (HeaderComponent.html:6)
at Object.debugUpdateDirectives [as updateDirectives] (core.js:23911)
at checkAndUpdateView (core.js:23307)
我认为您正在您的应用程序中使用 lazy-loading 如果是,您必须创建一个共享模块并将您的服务添加到其提供者中,然后将其导入到您要使用它的每个模块中。
@NgModule({
imports: [],
declarations: [],
exports:[],
providers: [
YourService
]
})
export class SharedModule {
}
我正在尝试在我的一个组件上使用共享服务。当我与应用程序根组件一起使用时,它工作正常。当我尝试在另一个 module/dashboard 上使用时,出现错误。
shared/authorize.service.ts
@Injectable()
export class AuthorizationService {
isDoingSomething() {
return "Some Boolean value";
}
}
dashboard/header/header.component.ts
@Component({
selector: 'app-header',
templateUrl: './header.component.html',
styleUrls: ['./header.component.css']
})
export class HeaderComponent {
constructor(private _auth: AuthorizeService,
private _router: Router) { }
}
dashboard/header/header.component.html
<mat-toolbar color="primary" role="heading">
<div fxFlex fxLayout fxLayoutAlign="flex-end">
<ul fxLayout fxLayoutGap="10px" class="navigation-items">
<li routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}">
<a routerLink="/home">Home</a>
</li>
<li routerLinkActive="active">
<a *ngIf="_auth.isDoingSomething()" routerLink="/docall">Rest Call</a>
</li>
</ul>
</div>
</mat-toolbar>
**HeaderComponent.html:6 ERROR TypeError:** Cannot read property 'isDoingSomething' of undefined at Object.eval [as updateDirectives] (HeaderComponent.html:6) at Object.debugUpdateDirectives [as updateDirectives] (core.js:23911) at checkAndUpdateView (core.js:23307)
我认为您正在您的应用程序中使用 lazy-loading 如果是,您必须创建一个共享模块并将您的服务添加到其提供者中,然后将其导入到您要使用它的每个模块中。
@NgModule({
imports: [],
declarations: [],
exports:[],
providers: [
YourService
]
})
export class SharedModule {
}