Angular 2从html调用super方法

Question

我成功地实现了继承课程。我想从模板中调用超级方法，但现在我得到的是Cannot read property 'presentModal' of undefined：

@Component({})
class Dia {
    constructor(public modalCtrl: ModalController) {
    }

    presentModal() {
        const detailModal = this.modalCtrl.create(AgendaDetails, { showDetails: 8675309 });
        detailModal.present();
    }
}

@Component({
    templateUrl: 'dimarts-tab.html',
})
export class Dimarts extends Dia { }

并在模板中：

<ion-item text-wrap (click)="super.presentModal()">

我也试过$ super，$ parent没有成功。目前唯一可行的解​​决方案是在Dimarts中创建方法并在那里调用super。

有任何想法吗？

Answer 1

super是ES6语法，不能在使用它的方法之外使用。鉴于有扩展Foo的Bar类，super关键字在Bar构造函数和静态方法中被解释为Foo，在实例方法中被解释为Bar.prototype。

class Foo extends Bar {
  foo() {
    super.foo()
  }
}

将被翻译成

var Foo = /** @class */ (function (_super) {
    __extends(Foo, _super);
    function Foo() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    Foo.prototype.foo = function () {
        _super.prototype.foo.call(this);
    };
    return Foo;
}(Bar));

在模板中使用super.presentModal()的尝试违背了类继承和原型链的目的。

除非在子类中定义了presentModal，否则它将从父类继承。它应该是：

<ion-item text-wrap (click)="presentModal()">