2

我和 Aurelia 一起玩，看起来很不错，我在一些项目中使用 Durandal，这绝对适合我的需求。

使用 EC6 中的新类定义很棒。但是现在我正在准备一些东西，我需要在其中使用带有 requireJs 的经典 AMD 模块，就像这样：

define("testModule",
[],
function() {
    "use strict";
    console.log('testModule loaded');

    var testModule = function() {
        var that = this;

        this.variable = 10;

        that.getVariable = function(){
            alert('function executed ' + that.variable);
        };
    }

    return testModule;
});

根据 Aurelia 的文档，我发现可以将 testModule 之类的东西用作 ViewModel，事实上，在 Durandal 应用程序中使用了 viewModel。

但是经过一些尝试后，我无法使其正常工作。

有人遵循了什么想法或方法来做到这一点？最重要的是，有可能吗？我认为这只是为了确认它们是兼容的。

谢谢。

4

2 回答 2

2

我们已经对此进行了一些试验。这是我们想出的。该作品基于 Skeleton Navigation App：

  1. 在项目根目录中创建一个文件夹amd。
  2. 将您的原始 Durandal VM（来自您的示例）原样复制到其中。

  3. 在里面创建一个 Wrapper 虚拟机，里面src也testmodule.js有这个内容：

    export class TestModule {
  constructor() {
  }

  activate() {
    return System.import('../amd/testmodule').then( (result) => {
      if(typeof result === 'function')
        Object.assign(this, new result());
      else
        Object.assign(this, result);
    });
  }
}
  4. 享受 ：）

这实际上是包装您的原始 DurandalVM 并将其公开为新的 AureliaVM。它只是一个开端，肯定有一些事情需要研究，比如尊重 Durandals LifeCycle 等，但我想这是一个好的开始

于 2015-03-04T17:27:02.417 回答
1

这是与 Aurelia 一起使用的示例 AMD 模块：

define(["require", "exports"], function (require, exports) {
  var Welcome = (function () {
    function Welcome() {
      this.heading = "Welcome to the Aurelia Navigation App (VS/TS)!";
      this.firstName = "John";
      this.lastName = "Doe";
    }
    Object.defineProperty(Welcome.prototype, "fullName", {
      get: function () {
        return this.firstName + " " + this.lastName;
      },
      enumerable: true,
      configurable: true
    });
    Welcome.prototype.welcome = function () {
      alert("Welcome, " + this.fullName + "!");
    };
    return Welcome;
  })();
  exports.Welcome = Welcome;
});

它实际上是由TypeScript 源文件生成的

export class Welcome {
  public heading: string;
  public firstName: string;
  public lastName: string;

  constructor() {
    this.heading = "Welcome to the Aurelia Navigation App (VS/TS)!";
    this.firstName = "John";
    this.lastName = "Doe";
  }

  get fullName() {
    return this.firstName + " " + this.lastName;
  }

  welcome() {
    alert("Welcome, " + this.fullName + "!");
  }
}

您可以按照GitHub 存储库中的示例说明使用该示例。

于 2015-02-08T10:43:47.643 回答