Aurelia - Use of components

Question

I'm newbie to Aurelia framework, a common and popular scenario: I have a container (view-model and view) that is populated by a collection of items (lets call it users accounts screen, that should contains a collection of user accounts).

The container uses a service that produce a collection of the users accounts data.

I have a view and a view-model which are bound together and represent a single user account - I would like the container use the user account view model by sending it a parameter (user account data) - the user account will receive the data and set it to its properties, so it can be bound to the view.

The purpose is that the user account view model will receive the data either in the constructor or in the activate (I think that this is preferred).

Answer 1

我通过在 compose 元素中使用 model.bind 属性解决了这个问题。

Answer 2

You can accomplish this by using simple databinding. The bound data would be available for binding in the component.

Here's an example: https://gist.run?id=a8f11e779253a1c6abb44dbec77a8b83

account-info.html

<template>
    Hello ${data.name}!
</template>

account-info.js

import {bindable} from 'aurelia-framework';

export class AccountInfo {
  @bindable data;
}

app.html

<template>
  <require from="./account-info"></require>

  <div><input type="text" value.bind="userData.name" /></div>
  <account-info data.bind="userData"></account-info>
</template>

app.js

export class App {
  userData = {
    name: 'Ashley'
  }
}