可能重复:
单身人士有什么不好的?
我最近听说过Singleton是一种反模式.我知道它与事实有关,使得一个类单例就像使该唯一实例成为一个全局变量,但它也做了很多(限制该对象的实例数,管理实例化等等).
为什么Singleton被认为是反模式?还有什么选择?
在Angular 2.0中,将没有$scope.
有什么替代方案?如何在组件之间共享数据?该scope选项是否可用于指令?更实际的是,有一种当前的替代品,我可以熟悉吗?
我知道,controller as但我读到控制器也将被淘汰.
Angular团队开始对这场革命感到困惑.
我知道如何将服务注入组件(通过@Component),但是如何使用DI来传递组件之外的服务?
换句话说,我不想这样做:
export class MyFirstSvc {
}
export class MySecondSvc {
constructor() {
this.helpfulService = new MyFirstSvc();
}
}
export class MyThirdSvc {
constructor() {
this.helpfulService = new MyFirstSvc();
}
}
Run Code Online (Sandbox Code Playgroud) 我在角度2中非常新.我在两个组件之间进行通信时遇到问题.当我有一个父项和一些子组件的布局时,可以很容易地使用@Input注释设置子组件的变量.
但是现在我有一个父组件的布局(主要用于布局)和两个子组件:
子组件2有一堆按钮,只创建一个简单的消息.现在我想在子组件1中显示此消息.
我该如何解决?提前致谢
我有一个用作本地数据存储的服务来跨应用程序共享数据。该服务在开始时会进行一些休息调用以初始化一些数据。它看起来像这样:
Injectable()
export class DataStoreService {
leadList: LeadModel[]
optyList: ContactModel[]
constructor(public dataService:DataService){
this.initializeData()
}
initializeData() {
this.dataService.getObjectData('opportunities').subscribe(
(data) => this.optyList = data
)
this.dataService.getObjectData('leads').subscribe(
(data) => this.leadList = data
)
}
}
Run Code Online (Sandbox Code Playgroud)
我有一个组件页面,我在下面做:
ngOnInit() {
for(let lead of this.dataStore.leadList){
if(lead.accepted == false)
this.newLeadsList.push(lead)
}
}
Run Code Online (Sandbox Code Playgroud)
很明显,如果初始化数据没有完成,leadList 可能是未定义的,这个 ngOnInit for 循环也会崩溃。那么,如何在 ngOnInit 中等待 initializeData 完成?
我是Angular2的新手,正在边做边学.现在,我已成功构建了一个包含父组件,多个子组件和数据库服务的多视图.现在我将要使用各自的父子组件来实现其他视图.
应用程序应该使用可以在其他组件中添加/更新/删除的相同数据集,因此我正在寻找一个单独的数据层,可以由应用程序的所有组件直接查询.更多 - 我需要相同的服务实例,以便中间数据随处可用,以及避免不必要的数据库访问.在Angular2中定义和使用这样一个类的最佳方法是什么?
更新问: 现在,当我可以直接访问整个应用程序中数据层的同一实例的变量时,处理组件中变量的最佳方法是什么?
a)我应该使用本地组件变量,它们是相同数据层变量的副本(因此显式加载,获取和设置它们),如
this.locations = this.datalayer.locations;
this.selectedLocation;
updateLocation(id) {
this.selectedLocation = id;
this.datalayer.setSelectedLocation(id);
}
getSelectedLocation() {
return this.selectedLocation;
}
Run Code Online (Sandbox Code Playgroud)
或者b)我应该专门处理数据层变量,迭代它们,从组件中获取和设置它们吗?
updateLocation(id) {
this.datalayer.selectedLocation = id;
}
getSelectedLocation() {
return this.datalayer.selectedLocation;
}
Run Code Online (Sandbox Code Playgroud)
或者可能有一个选项c?
data-layers typescript angular2-routing angular2-services angular
根据我的理解,在Angular 2中,如果要在不相关的组件之间传递值(即,不共享路由的组件,因此不共享父子关系),则通过共享服务执行此操作.
这就是我在Angular2应用程序中设置的内容.我正在检查一个url中是否存在一系列字符,如果存在则返回true.
isRoomRoute(routeUrl) {
if ((routeUrl.includes('staff') || routeUrl.includes('contractors'))) {
console.log('This url: ' + routeUrl + ' is a roomRoute');
return true;
} else {
console.log('This url: ' + routeUrl + ' is NOT a room route');
return false;
}
}
Run Code Online (Sandbox Code Playgroud)
在根app.component的构造函数中,我正在订阅路由事件:
constructor(private routeService: RouteService,
private router: Router) {
this.router.events.subscribe((route) => {
let routeUrl = route.url;
this.routeService.sendRoute(routeUrl);
this.routeService.isRoomRoute(routeUrl);
});
}
Run Code Online (Sandbox Code Playgroud)
...然后使用提供的URL来检查url是否包含特定字符串.每次路线更改时都会对此进行评估.
所以这一切都按预期工作.
但是,我在将该检查的结果传递给另一个不相关(非父子)组件时遇到了问题.
即使我在app.component和un-related(room.component)组件中使用共享服务(routeService),但在一个组件中工作的东西在另一个组件中不起作用.根据我的理解,这里检查的内容的"真实性"应该足以回复真实的陈述.
但是在次要的,不相关的组件中,当我调用函数时,我得到一个"未定义"错误,如下所示:
isRoomRoute() {
if (this.routeService.isRoomRoute(this.routeUrl)) {
return true;
}
}
Run Code Online (Sandbox Code Playgroud)
所以这就是我被困住的地方.基本上,关于url是否包含某个字符串的评估已经发生.现在我只需要将该检查的布尔结果传递给辅助的非相关组件.我怎样才能在Angular 2中做到最好?
我有两个组件A和B,其中组件A包含一个按钮.我希望当用户点击此按钮时,在组件B上触发一个功能
<A></A>
<router-outlet></router-outlet>
Run Code Online (Sandbox Code Playgroud)
并且组件B使用routing进行渲染.我正在考虑使用具有可观察布尔值的服务,该服务指示是否单击了A中的按钮.这是实现它的正确方法吗?
在 Angular2 中,假设我有 component1(将其用作左侧面板导航器)和 component2 。这两个组件彼此不相关(兄弟姐妹,父子关系,......)。如何从 component2 调用 component1 中的函数?我不能在这里使用事件绑定。
我想从Angular Service中检索更新的对象值(借用者).我Subject在服务中创建了一个RxJS ,以便多个组件可以订阅它并获得更新的值.
当我通过组件中提供的服务订阅Subject时,我发现onNext()即使.next()从BorrowerService 调用函数参数也不会被调用.
如果我在BorrowerService类中订阅,我发现它.next()按预期工作.似乎Subject是调用的Service类.next()和组件之间的不同实例,因此不会获得该订阅.
这是否无法理解Angular Services或Observables?如何在不知道何时调用的情况下更新服务中的值并被动地获取组件中的更改.next()?
借款人-report.component.ts
@Component({
...
providers: [BorrowerService]
})
export class BorrowerReport {
private borrower: Borrower;
constructor(private borrowerService: BorrowerService) {
this.borrowerService.borrowerChanged.subscribe(borrower => {this.borrower = borrower});
}
}
Run Code Online (Sandbox Code Playgroud)
borrower.service.ts
@Injectable()
export class BorrowerService {
public borrowerChanged: Subject<Borrower> = new Subject<Borrower>();
//event handler
selectBorrower(borrower: Borrower) {
this.borrowerChanged.next(borrower);
}
}
Run Code Online (Sandbox Code Playgroud) angular ×11
typescript ×4
javascript ×3
components ×2
data-layers ×1
events ×1
forms ×1
listener ×1
multi-step ×1
promise ×1
router ×1
rxjs ×1