Question

我和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，事实上viewModel是在Durandal应用程序中使用的。

但经过一些尝试后，我无法实现这一目标。

有人遵循的任何想法或方法吗？最重要的是，它有可能吗？我认为只是确认它是兼容的。

感谢。

Answer 1

我们一直在尝试一下。这就是我们想出的。这项工作基于Skeleton Navigation App：

在项目根目录中创建文件夹amd。
将原始Durandal VM（来自您的示例）原样复制到其中。
使用此内容在名为src的{{1}}内创建一个包装器虚拟机：
```
testmodule.js
```
享受：）

这样做基本上是包装你的原始DurandalVM并将其作为新的AureliaVM公开。它只是一个启动器，肯定有一些事情需要考虑尊重Durandals LifeCycle等，但我认为这是一个好的开始

Answer 2

这是一个与Aurelia合作的example AMD module：

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 source file

生成的

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存储库中的the sample's instructions来处理示例。

使用AMD模块作为Aurelia ViewModel

2 个答案: