如何在 Angular 8 中使用匿名函数创建 class

How to create a class with annonymous functions in Angular8

我正在开发一个 Angular 8 应用程序,需要使用一个库来显示 3D 模型(JS + WASM)。为了我的树 Table 和 3D 模型之间的交互,我需要在这个库中注册一个观察者。

用于注册观察者(对于这个库)的给定代码示例是用 AngularJS 编写的:

报名人数:

$scope.RegisterSelectionObserver = function() {
    if ($scope.selectionObserver == null) {
        $scope.selectionObserver = new $scope.MySelectionClass();
        $scope.session.RegisterSelectionObserver($scope.selectionObserver);
    }
}

Class定义:

$scope.MySelectionClass = Module.SelectionEvents.extend("SelectionEvents", {
        __construct: function() {
            this.__parent.__construct.call(this);
            this.SetEventsFilter(Module.EVENTS_PICKS | Module.EVENTS_SELECTION);
        },

        OnSelectionBegin: function () {
            if ($scope.webglSettings.selectionLogging === 'YES') {
                console.log("OnSelectionBegin");
            }
        },
     });

我的领养: 我试图用它的构造函数创建一个 class 并将其传递给观察者注册,但出现错误。

我的自定义class:

export class ExtSelectionEvents{
    constructor(){
    }

    OnSelectionBegin(){
        console.log('OnSelectionBegin');
    }
}

我正在注册:

const extSelectionEventsInstance = new ExtSelectionEvents();
session.RegisterSelectionObserver(extSelectionEventsInstance);

错误:

zone.js:703 Unhandled Promise rejection: Cannot pass "[object Object]" as a SelectionEvents* ; Zone: ; Task: Promise.then ; Value: BindingError {name: "BindingError", message: "Cannot pass "[object Object]" as a SelectionEvents*", stack: "BindingError: Cannot pass "[object Object]" as a S…erences (http://localhost:4200/scripts.js:181:13)"}message: "Cannot pass "[object Object]" as a SelectionEvents*"name: "BindingError"stack: "BindingError: Cannot pass "[object Object]" as a SelectionEvents*↵
at BindingError. (http://localhost:4200/assets/js/libthingview_wasm.js:1:117337)↵
at new BindingError (eval at createNamedFunction (http://localhost:4200/assets/js/libthingview_wasm.js:1:116224), :4:34)↵ at throwBindingError (http://localhost:4200/assets/js/libthingview_wasm.js:1:118918)↵ at RegisteredPointer.nonConstNoSmartPtrRawPointerToWireType [as toWireType] (http://localhost:4200/assets/js/libthingview_wasm.js:1:134368)↵ at Session$RegisterSelectionObserver [as RegisterSelectionObserver] (eval at new_ (http://localhost:4200/assets/js/libthingview_wasm.js:1:142970), :8:26)↵ at OverviewComponent.push../src/app/views/mechportal/overview/overview.component.ts.OverviewComponent.callback (http://localhost:4200/views-mechportal-overview-overview-module.js:18109:17)↵ at http://localhost:4200/scripts.js:18:31↵ at http://localhost:4200/scripts.js:182:17↵ at _loadPreferences (http://localhost:4200/scripts.js:304:9)↵ at Object.LoadPreferences (http://localhost:4200/scripts.js:181:13)"proto: Error BindingError: Cannot pass "[object Object]" as a SelectionEvents* at BindingError. (http://localhost:4200/assets/js/libthingview_wasm.js:1:117337) at new BindingError (eval at createNamedFunction (http://localhost:4200/assets/js/libthingview_wasm.js:1:116224), :4:34)

总结:

库需要 OnSelectionBegin 的匿名函数,因为它正在创建它的命名函数。

MySelectionClass 中发生了什么,我如何翻译 AngularJS Class 定义及其匿名函数以与 Angular 8 / 库一起使用?

不确定,但你应该应付 JS class :

export class ExtSelectionEvents extends SelectionEvents{
    constructor() {
      super();
    }

    OnSelectionBegin(){
        console.log('OnSelectionBegin');
    }
}

class SelectionEvents 是缺少的和平。

在 Module 的全局声明(声明 var Module: any)之后,我终于可以扩展 SelectionEvents class 并实现我的方法。

Angular 和 AngularJS 的实现之间的唯一区别是作用域不同。在 AngularJS 中,它被绑定到控制器的范围,现在它在全局范围内。

   const MyEventsClass = Module.SelectionEvents.extend("SelectionEvents", {

  __construct: function () {
    this.__parent.__construct.call(this);
    this.SetEventsFilter(Module.EVENTS_PICKS | Module.EVENTS_SELECTION);
  },

  OnSelectionBegin: function () {
      console.log("OnSelectionBegin");
      console.dir(this);
  }
});

session.RegisterSelectionObserver(new MyEventsClass());