Question

我所做的总结是 1）创建了一个存储字符串值的简单服务。 2）在appModule中提供。 3）创建了2个组件：第一个和第二个。我没有提供组件中的服务 - 但是通过构造函数注入服务。 4）添加了2条路线，用于在第一和第二之间导航。第一个组件将字符串保存到服务中，第二个组件应该从服务中检索存储的字符串 - 这不起作用。我已经研究了2天的解决方案，超过了教程 - 似乎它应该工作！ stackoverflow上没有解决的答案似乎为我提供了一个明确的解决方案。其他一切都在发挥作用。导入正常 - 浏览器中没有编译或运行时错误。

请帮忙。

以下是没有明显导入的代码段：

// app.module.ts
...
const appRoutes: Routes = [
  {path: '', redirectTo: '/first', pathMatch: 'full'},
  {path: 'first', component: FirstComponent},
  {path: 'second', component: SecondComponent},
];


@NgModule({
  declarations: [
    AppComponent,
    FirstComponent,
    SecondComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    RouterModule.forRoot(appRoutes)
  ],
  providers: [DataService],
  bootstrap: [AppComponent]
})
export class AppModule { }


// first component
...

import {DataService} from '../services/data.service';

@Component({
  selector: 'app-first',
  templateUrl: './first.component.html',
  styleUrls: ['./first.component.css']
})
export class FirstComponent implements OnInit {
  localToken: string;

  constructor(private svc: DataService) { }

  ngOnInit() {
    this.svc.save("000000");
  }

}


// second component
...
import {DataService} from '../services/data.service';

@Component({
  selector: 'app-second',
  templateUrl: './second.component.html',
  styleUrls: ['./second.component.css']
})
export class SecondComponent implements OnInit {
  localToken: string;

  constructor(private svc: DataService) { }

  ngOnInit() {
    // THIS DOES NOT WORK !!!
    this.localToken = this.svc.retrieve();

  }

}

问：我做错了什么？

Answer 1

在Simona的帮助下，我终于让单身人士服务工作得很好了！

创建服务
将其导入appModule
将其添加到提供者数组

在组件中

从'{path}'导入服务{};
将其作为私有parm添加/注入构造函数中服务导入
在类成员方法中使用this.parm ...

有效！，谢谢Simona

Answer 2

正如here所述，您的服务必须标记为可注入

从'@ angular / core'导入{Injectable};

@Injectable（）导出类HeroService {}

角2单身人士服务对我不起作用

2 个答案: