19、表单处理与验证：Aurelia框架实践

表单处理与验证：Aurelia框架实践

1. 多值选择绑定

在应用中，我们希望实现一个功能，允许将书籍分配到一个或多个书架。这非常适合使用多值选择元素，将其绑定到视图模型上的选定值数组。由于多选择控件在简洁的编辑书籍表单中一直显示会显得有些笨拙，因此我们添加一个模板条件，以便在用户点击“编辑”按钮时按需显示该控件。

在修改视图以实现此功能之前，需要在构造函数中初始化一个新的 editingShelves 布尔字段，以指示是否应显示多选择控件。以下是相关代码：

@inject(EventAggregator, BookApi ) 
export class EditBook{

    @bindable editMode;
    @bindable book;
    @bindable selectedGenre; 
    constructor(eventAggregator, bookApi ){
        // ...
        this.bookApi = bookApi;
        this.editingShelves = false;          
    }
}

接下来，需要修改 edit-book.html 视图文件以支持新的多选择书架控件。具体步骤如下：
1. 添加带有 multiple 属性的新 select 元素。
2. 使用 show.bind 绑定命