Aurelia 简单绑定不起作用
Aurelia simple binding is not working
我有一个非常简单的绑定,但无法正常工作:
app.js:
export class PupilsViewer {
pupilsInfo = [
{ name: 'John' },
{ name: 'Eric' },
{ name: 'Martin' },
{ name: 'Simon' }
];
}
app.html:
<template>
<require from="./pupil"></require>
<pupil repeat.for="pupilInfo of pupilsInfo" info="${pupilInfo}"></pupil>
</template>
pupil.js:
import {bindable} from 'aurelia-framework';
export class Pupil {
@bindable info = { name: 'unknown' };
}
pupil.html:
<template>
<div>Name: ${info.name}</div>
</template>
这导致以下输出:
Name: unknown
Name: unknown
Name: unknown
Name: unknown
虽然我已经预料到:
Name: John
Name: Eric
Name: Martin
Name: Simon
现在我遇到了同样的问题。这似乎是一个错字问题。尝试更改或删除可绑定的驼峰式大小写。但是你的绑定也不对。
export class PupilsViewer {
pupils = [
{ name: 'John' },
{ name: 'Eric' },
{ name: 'Martin' },
{ name: 'Simon' }
];
}
app.html
<template>
<require from="./pupil"></require>
<pupil repeat.for="pupil of pupils" info.bind="pupil"></pupil>
</template>
pupil.js
import {customElement, bindable} from 'aurelia-framework';
@customElement('pupil')
@bindable('info')
export class Pupil {
}
我有一个非常简单的绑定,但无法正常工作:
app.js:
export class PupilsViewer {
pupilsInfo = [
{ name: 'John' },
{ name: 'Eric' },
{ name: 'Martin' },
{ name: 'Simon' }
];
}
app.html:
<template>
<require from="./pupil"></require>
<pupil repeat.for="pupilInfo of pupilsInfo" info="${pupilInfo}"></pupil>
</template>
pupil.js:
import {bindable} from 'aurelia-framework';
export class Pupil {
@bindable info = { name: 'unknown' };
}
pupil.html:
<template>
<div>Name: ${info.name}</div>
</template>
这导致以下输出:
Name: unknown
Name: unknown
Name: unknown
Name: unknown
虽然我已经预料到:
Name: John
Name: Eric
Name: Martin
Name: Simon
现在我遇到了同样的问题。这似乎是一个错字问题。尝试更改或删除可绑定的驼峰式大小写。但是你的绑定也不对。
export class PupilsViewer {
pupils = [
{ name: 'John' },
{ name: 'Eric' },
{ name: 'Martin' },
{ name: 'Simon' }
];
}
app.html
<template>
<require from="./pupil"></require>
<pupil repeat.for="pupil of pupils" info.bind="pupil"></pupil>
</template>
pupil.js
import {customElement, bindable} from 'aurelia-framework';
@customElement('pupil')
@bindable('info')
export class Pupil {
}