【问题标题】:ngControl resulting in undefinedngControl 导致未定义
【发布时间】:2016-09-30 23:02:27
【问题描述】:

我试图简单地将绑定到输入字段的 ngControl 角度对象记录到控制台,以便我可以看到它的内容。下面是一个非常基本的 ngControl 示例,它看起来应该可以工作,但是当我尝试登录到控制台时,我变得不确定。

有人遇到过吗?我感谢任何帮助解决问题。

应用组件

import {Component} from 'angular2/core';
import {ContactFormComponent} from './contact-form.component';

@Component({
    selector: 'my-app',
    directives: [ContactFormComponent],
    template: '<contact-form></contact-form>',
})
export class AppComponent {

}

联系表格模板

import {Component, Input} from 'angular2/core';

@Component({
    selector: 'contact-form',
    templateUrl: 'app/contact-form.component.html'
})
export class ContactFormComponent{
    log(x) {
        console.log(x);
    }
}

表单模板

<form>
    <div class="form-group">
        <label for="firstName">First Name</label>
        <input ngControl="firstName" #firstName="ngForm" (change)="log()" id="firstName" type="text" class="form-control">
    </div>
    <div class="form-group">
        <label for="comment">
            Comment
        </label>
        <textarea ngControl="comment" #comment="ngForm" (change)="log()" id="comment" cols="30" rows="10" class="form-control">
        </textarea>
        <button class="btn btn-primary" type="submit">Submit</button>
    </div>
</form>

【问题讨论】:

  • 我没有看到您导入 FormsModule 或任何允许您使用该指令的 @angular/forms 部分。你有导入 FormsModule 的 NgModule 吗?
  • 我正在一步一步地按照视频教程进行操作,但它并没有导入它,而且它似乎对他有用,所以我假设在那个 RC 上没有必要?请注意,他直到教程后面才更新到最新的 RC - 这似乎对他有用
  • 我建议遵循官方表单教程 (angular.io/docs/ts/latest/guide/forms.html)。 RC 版本的变化非常快,使用这些预发布版本的项目不太可能使用最新的 Angular 版本完全运行。
  • 请注意,angularjs 标签适用于 Angular 1.x。如果您使用的是 Angular 2,只需使用 angular2 标签。

标签: angular


【解决方案1】:
#comment="ngForm" => try #comment="Form"

【讨论】:

    猜你喜欢
    • 2018-01-05
    • 2017-02-10
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-04-05
    • 2014-01-31
    相关资源
    最近更新 更多