Question

我正在寻找最佳实践＆＃39;在ng2中处理组件和服务通信时输入建议。

让我们说，例如，我有以下内容：

//auth.service.ts
import {Injectable} from 'angular2/core';

@Injectable()
export class AuthService {

    login() {
       //do some login stuff here
    }

}

//login.component.ts
import {Component} from 'angular2/core';
import {AuthService} from './path/to/auth.service';

@Component({

    selector: 'app-login',
    template: '<button (click)="">Login</button>',
    providers: [AuthService]

})

export class LoginComponent {

    constructor (
    public _authService: AuthService
    ) {}

}

我的问题主要集中于此：

<button (click)="">Login</button>

我应该只做(click)="_authService.login()"之类的事情，还是应该在LoginComponent中创建一个登录方法并在视图中引用它？

<button (click)="login()">Login</button>

export class LoginComponent {

    constructor (
    public _authService: AuthService
    ) {}

    login() {
    this._authService.login();
    }

}

我正在考虑后者，因为感觉这种观点与服务完全脱节，但是，我已经看到了人们更喜欢初始方法的评论。此外，在_authService可能还有一些数据需要绑定到视图的情况下，在这种情况下，视图可以检测到对该数据的更改的唯一方法是直接绑定到{{1 }}。

在创建这两种方法之间的沟通时，哪种方法被认为是最佳做法？

Answer 1

最佳做法是将服务设为私有，并使用组件中的方法来调用服务。通常，变量名中的下划线表示它是私有的。

constructor (
    private _authService: AuthService
    ) {}

这使您的代码更加模块化。如果您决定使用差异服务或编写自己的逻辑来执行相同的操作，则不必更新模板中的HTML。您只需更新您的方法。

角度中组分与注射剂之间的通信2

1 个答案: