如何扩展组件?

时间:2016-01-12 21:35:56

标签: angular

我有一个组件A我想多次重复使用,但有其他属性和方法。如何使用它扩展组件BA会重写模板吗?或者我应该使用指令?它甚至可能吗?

1 个答案:

答案 0 :(得分:2)

我这里有一个继承的样本。

    export class Clock {

        time:string;
        offset:number;

        constructor(offset){
            this.offset = offset;
        }

        ngOnInit(){
            this.time = moment.utc().add(this.offset,'h');
            setInterval(() => {
                this.time = moment.utc().add(this.offset,'h');
            },1000);
        }
    }

    //component1
    @Component({
        selector: 'new-york',
        templateUrl: './clock.html'
    })

    export class NewYork extends Clock{
        city = 'New York';

        constructor(){
            super(-5);
        }
    }

    //component2
    @Component({
        selector: 'london',
        templateUrl: './clock.html'

    })

    export class London extends Clock{
        city = 'London';

        constructor(){
            super(0);
        }
    }

我在3个不同的组件中重用Clock类。