angularjs 1.5 组件数据绑定到数组
angularjs 1.5 component databinding to array
我无法弄清楚将数组绑定到 table 的数据绑定语法。我有一个父 TodoComponent,它将一个 todoList 传递给一个子组件 TodoListComponent。子组件 (TodoListComponent) 正在正确接收数据,但未绑定到模板。
父组件
const TodoComponent = {
bindings: {
todos: '<'
},
template: `
<div class="todo">
<table>
<tbody>
<todo-list todos="$ctrl.todos"></todo-list>
</tbody>
</table>
</div>
`
};
子组件
const TodoListComponent = {
bindings: {
todos: '<',
},
template: `
<tr ng-repeat="todo in $ctrl.todos">
<td>{{ todo.text }}</td>
</tr>
`
};
如果我只是打印出 json 它会显示数据,所以我知道数据已返回
template: `
<pre>{{$ctrl.todos|json}}</pre>
`
看起来我不能只为父模板中带有 table 的 table 行创建子模板。当我将整个 table 移动到它工作的子模板时。如果其他人可以 post 作为替代方案,我将很乐意接受它作为有效答案。
我有类似的问题,用双向数据绑定“=”解决了。
你用过吗?
...
bindings: {
todos: '='
}
...
我无法弄清楚将数组绑定到 table 的数据绑定语法。我有一个父 TodoComponent,它将一个 todoList 传递给一个子组件 TodoListComponent。子组件 (TodoListComponent) 正在正确接收数据,但未绑定到模板。
父组件
const TodoComponent = {
bindings: {
todos: '<'
},
template: `
<div class="todo">
<table>
<tbody>
<todo-list todos="$ctrl.todos"></todo-list>
</tbody>
</table>
</div>
`
};
子组件
const TodoListComponent = {
bindings: {
todos: '<',
},
template: `
<tr ng-repeat="todo in $ctrl.todos">
<td>{{ todo.text }}</td>
</tr>
`
};
如果我只是打印出 json 它会显示数据,所以我知道数据已返回
template: `
<pre>{{$ctrl.todos|json}}</pre>
`
看起来我不能只为父模板中带有 table 的 table 行创建子模板。当我将整个 table 移动到它工作的子模板时。如果其他人可以 post 作为替代方案,我将很乐意接受它作为有效答案。
我有类似的问题,用双向数据绑定“=”解决了。
你用过吗?
...
bindings: {
todos: '='
}
...