ViewModel-less与aurelia中的model.bind组合

Question

我有一个结构，主视图组成一个局部视图，组成转发器中的另一个局部视图。

示例：

主视图

<template>
    <h1>${factory.name}</h1>
    <div class="column">
        <compose view="./cars.html"></compose>
    </div>
</template>

汽车查看

<template repeat.for="car of factory.cars">
    <compose view="./specifications.html model.bind="{test: 'abc}"></compose>
</template>

规范视图

<template repeat.for="car of factory.cars">
    <h1>${$parent.$parent.factory.name} - ${car.name}</h1>
    ${test}
</template>

我面临的问题是撰写中的model.bind不起作用。我尝试使用上面的test，但我实际想要传递的内容是$parent.$parent.factory，因此我可以在$parent.$parent.factory.name中输出specifications view。

（我知道我可以像这样打印它，但这种情况变得更加复杂 绑定是必要的）

值得一提的是，specifications和cars视图都是viewmodel-less。只有main视图具有factory和cars来自的视图模型。

According to this page，我想做的事情是可能的，但我无法理解我做错了什么。

Answer 1

当仅使用html文件编写时，引用的html文件的视图模型与放置compose元素的视图模型相同。换句话说，它继承了父级的视图模型。所以你不需要提供模型。

主视图

<template>
    <h1>${factory.name}</h1>
    <div>
        <compose view="./cars.html"></compose>
    </div>
</template>

<强> cars.html

<template>
  <div  repeat.for="car of factory.cars">
    <compose view="./specifications.html"></compose>
  </div>
</template>

<强> specifications.html

<template>
    <h1>${factory.name} - ${car.name}</h1>
</template>

看看这个GistRun example。

Answer 2

@Jeff G所说的是正确的，但是对于我的具体用例，解决了我的问题的是创建一个我可以用于所有合成的简单视图模型。它看起来像：

export class Main {
    public parentFactory;

    public activate(data) {
        this.parentFactory= data;
    }
}

在视图中

    <compose
        view="./car.html"
        view-model="../view-models/main"
        model.bind="$parent.$parent.factory">
    </compose>