Question

几天前我开始探索最近发布的Angular 2 RC 2，并试图将我的应用程序从Angular 2 RC 1迁移到Angular 1 RC 2。

我在我的应用程序中使用Angular 2 Material 2 Alpha 5.

虽然迁移并没有花费太多时间，但是当我编译并运行应用程序时，我发现使用Angular 2材料2组件的表单已被破坏。

材质表单控件不适用于Angular 2 RC 2，控制台显示以下错误：

EXCEPTION: No value accessor for 'firstName'.

我在md-input，md-slide-toggle和md-checkbox上对其进行了测试，我收到了以下所有异常。

EXCEPTION: No value accessor for 'Field name'.

Answer 1

我假设您已成功将表单迁移到Angular 2 RC 2。

如果要将Angular 2 RC 1（或更早版本）表单迁移到Angular 2 RC 2 您可能会发现这对新表单很有用

How to migrate Angular 2 RC 1 (or earlier) Forms to Angular 2 RC 2 / RC 4 New Forms

要使角度材料起作用，您需要进行以下更改：

<强>替换

job

<强>与

var common_1 = require('@angular/common');

在以下文件中：

var common_1 = require('@angular/forms');

虽然在材料组件中进行上述更改源文件适用于其他组件但不适用于Checkbox。此更改确实删除了表单加载时的ValueAccessor错误，但是在提交表单时，如果选中了复选框，则会在对象下面发布，如果已选中该复选框：

node_modules/@angular2-material/checkbox/checkbox.js
node_modules/@angular2-material/input/input.js
node_modules/@angular2-material/radio/radio.js
node_modules/@angular2-material/slide-toggle/slide-toggle.js

为了解决这个问题，我们需要在以下文件中进行另一项更改：

myCheckbox: MdCheckboxChange
checked:true
source:MdCheckbox
__proto__:Object
constructor:MdCheckboxChange()
__proto__:Object

<强>找到

node_modules/@angular2-material/checkbox/checkbox.js

并将其替换为以下：

MdCheckbox.prototype.registerOnChange = function (fn) {
    if (this._changeSubscription) {
        this._changeSubscription.unsubscribe();
    }
    this._changeSubscription = this.change.subscribe(fn);
};

我希望你能找到以上有用的东西。

Answer 2

别忘了添加＆＃34;提供表格＆＃34;在main.ts（或js）中调用你的bootstrap代码

我的引导代码看起来像

return bootstrap(<Type>AppComponent, [
    ...PROVIDERS,
    ...ENV_PROVIDERS,
    ...DIRECTIVES,
    ...PIPES,
    ...APP_PROVIDERS,
    ...APP_ROUTER_PROVIDERS,
    disableDeprecatedForms(),
    provideForms()
])

使用Angular 2 Material 2 Alpha 5和Angular 2 RC 2

2 个答案: