Aurelia 使用交换顺序对路由器1.0.1进行模板化时出错

为1.0.1更新了aurelia模板路由器

使用

时出现错误 发生

如果我删除swap order=“with”，错误将消失

如果我使用1.0.0版，即使使用了

swap order=“with”

，一切都正常。 有人经历了这一切

我不能在GistRun上玩，内容如下（打字稿）：

应用程序ts

export class App {
  router:any;
  configureRouter(config, router) {
    this.router = router;
    config.title = 'Aurelia';
    config.map([
      { route: ['', 'home'],  name: 'home', moduleId: 'home'}
    ]);
  }
}

export class Home{}

app.html

<template><router-view swap-order="with"></router-view></template>

<template><h1>HOME</h1></template>

这足以看出错误

au run --watch

---

这个问题似乎来自aurelia模板路由器中的一个bug

这个问题在这里被报道：可能很快就会被修复，但是现在它可以通过简单地在aurelia模板路由器中进行更改来修复

目前，在aurelia模板路由器的router-view.js中的swap函数中，工作函数定义中定义了previousView，如下所示：

//router-view.js

  swap(viewPortInstruction) {
    let layoutInstruction = viewPortInstruction.layoutInstruction;

    let work = () => {
//////////////////////////////////////////////////////////////////////////
     let previousView = this.view; ////This is not being correctly set 
//////////////////////////////////////////////////////////////////////////
      let swapStrategy;
      let viewSlot = this.viewSlot;

      swapStrategy = this.swapOrder in swapStrategies
                  ? swapStrategies[this.swapOrder]
                  : swapStrategies.after;

      swapStrategy(viewSlot, previousView, () => {
        return Promise.resolve().then(() => {
          return viewSlot.add(this.view);
        }).then(() => {
          this._notify();
        });
      });
    };
...    

目前，previousView没有为上一个视图设置正确的对象，并且在删除它时无法找到它

当我将先前的视图更改为在交换函数的范围内定义时，一切似乎都正常工作，并且通过了所有测试

似乎只需移动上一个视图定义即可

//router-view.js

  swap(viewPortInstruction) {
    let layoutInstruction = viewPortInstruction.layoutInstruction;
//////////////////////////////////////////////////////////////////////////
    let previousView = this.view;  ////This is now being correctly set 
//////////////////////////////////////////////////////////////////////////

    let work = () => {

      let swapStrategy;
      let viewSlot = this.viewSlot;

      swapStrategy = this.swapOrder in swapStrategies
                  ? swapStrategies[this.swapOrder]
                  : swapStrategies.after;

      swapStrategy(viewSlot, previousView, () => {
        return Promise.resolve().then(() => {
          return viewSlot.add(this.view);
        }).then(() => {
          this._notify();
        });
      });
    };
...    

您可以在此处轻松重现错误：

---

您是否有可能在gist.run上创建一个副本，然后将一个问题发布到github上的路由器repo？假设您的

只是一个输入错误，而不是您的代码中，对吗？应该是

。是的

在这里只是一个输入错误，而不是在您的代码中创建一个复制。您可以为我开始相同的问题，有解决方案吗？

//router-view.js

  swap(viewPortInstruction) {
    let layoutInstruction = viewPortInstruction.layoutInstruction;

    let work = () => {
//////////////////////////////////////////////////////////////////////////
     let previousView = this.view; ////This is not being correctly set 
//////////////////////////////////////////////////////////////////////////
      let swapStrategy;
      let viewSlot = this.viewSlot;

      swapStrategy = this.swapOrder in swapStrategies
                  ? swapStrategies[this.swapOrder]
                  : swapStrategies.after;

      swapStrategy(viewSlot, previousView, () => {
        return Promise.resolve().then(() => {
          return viewSlot.add(this.view);
        }).then(() => {
          this._notify();
        });
      });
    };
...    

//router-view.js

  swap(viewPortInstruction) {
    let layoutInstruction = viewPortInstruction.layoutInstruction;
//////////////////////////////////////////////////////////////////////////
    let previousView = this.view;  ////This is now being correctly set 
//////////////////////////////////////////////////////////////////////////

    let work = () => {

      let swapStrategy;
      let viewSlot = this.viewSlot;

      swapStrategy = this.swapOrder in swapStrategies
                  ? swapStrategies[this.swapOrder]
                  : swapStrategies.after;

      swapStrategy(viewSlot, previousView, () => {
        return Promise.resolve().then(() => {
          return viewSlot.add(this.view);
        }).then(() => {
          this._notify();
        });
      });
    };
...