Question

假设我有一些组成部分：

@Component({
    selector: 'my-view',
    templateUrl: './view.component.html',
    styleUrls: ['./view.component.scss']
})

export class ViewComponent implements OnInit {
    // used to alias the actual user data, set with OnInit
    private plan: string;
    private status: string;
    private started: string;
    private cycle: string;

    constructor (private auth: Auth, private modal: Modal, private router: Router) {}

    ngOnInit(): void {
        // without these shorthand names the components code would be messy and unreadable
        this.plan = this.auth.userProfile.user_metadata.plan;
        this.status = this.auth.userProfile.user_metadata.token.status;
        this.started = this.auth.userProfile.user_metadata.token.epoch;
        this.cycle = this.auth.userProfile.user_metadata.cycle;

        // do stuff using alias variables so I don't have to use extremely long names
        if(this.plan === .... && this.cycle === ...) {

        }
    }
}

这种情况允许我使用更短更简单的变量名称而不是我通常用来访问用户数据的长名称，但在用户数据在此页面上更新时会中断。

由于别名变量仅在onInit期间设置，当用户数据发生更改时，这些变量不会反映该更改，用户需要刷新整个页面以查看更改。

有没有办法轻松做到这样的事情，但让像plan, status, started, cycle这样的变量观察原始值并相应更新？否则我需要使用长名称并牺牲我的代码的可读性。

Answer 1

您可以使用getter函数或ES6属性：

@Component({
    selector: 'my-view',
    templateUrl: './view.component.html',
    styleUrls: ['./view.component.scss']
})
export class ViewComponent implements OnInit {
    constructor (private auth: Auth, private modal: Modal, private router: Router) {}

    private get plan(): string { // property
        return this.auth.userProfile.user_metadata.plan;
    }

    private getStatus(): string { // getter
        return this.auth.userProfile.user_metadata.status;
    }

    ngOnInit(): void {
        if(this.plan === .... && this.getStatus() === ...) {

        }
    }
}

Answer 2

wrappers.hpp，sse.hpp，string等原始值始终按值传递。对象通过引用传递。看起来你想要的是＆＃34;通过引用传递＆＃34;原始类型。

您可以做的是用对象包装值并改为传递该对象。

通常，使用observable通知感兴趣的其他类实例有关值更改的更好方法。

有关示例，请参阅https://angular.io/docs/ts/latest/cookbook/component-communication.html#!#bidirectional-service

Typescript使变量充当另一个变量的指针

2 个答案: