Question

请我是Angular的新手，我正在接受Felipe Coury的教程。在本书的一章（编写你的第一个有角度的2 web应用程序）中，他使用＆＃34; .value＆＃34;显示我们要输入的标题和链接。对他而言，它运作良好，但在我的系统上，它一直显示＆＃34; ERROR TypeError：无法读取属性＆＃39;值＆＃39;未定义＆＃34;。我不知道是不是因为我将角度cli升级到4.5.0。如果你有解决方案，请帮助我。

这是我的代码

    app.component.ts

    import { Component } from '@angular/core';
    import { Article } from 'app/article/article.model';

    @Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css']
    })
    export class AppComponent {
    addArticle(title: HTMLInputElement, link: HTMLInputElement): boolean {
    console.log(`Adding article title: ${title.value} and link: 
    ${link.value}`);

    this.articles.push(new Article (title.value, link.value, 0));
    title.value='';
    link.value='';
    return false;
    }
    articles:Article[];

    constructor() {
    this.articles = [
    new Article ('Angular 2', 'http://www.angular.io', 3),
    new Article ('Fullstack', 'http://www.fullstack.io', 10),
    new Article ('Anguar Home page', 'http://www.angular.io', 4)
    ]
    }
    }

这是app.component.html

    app.component.html
    <form class="ui large form segment">
    <h3 class="ui header">Add a Link</h3>

    <div class="field">
    <label for="title">Title:</label>
    <input name="title"  #newtitle>
    </div>
    <div class="field">
    <label for="link">Link:</label>
    <input  name="link"  #newlimk>
    </div>

    <button (click)="addArticle(newtitle, newlink)"
     class="ui positive right floated button">
    Submit link
    </button>
    </form>
    <div class="ui grid posts">
    <app-article
    *ngFor="let foobar of articles"
    [article]="foobar">
    </app-article>
    </div>

谢谢！

Answer 1

你应该使用

 <input name="link" #newlink>

所以...... newlink代替newlimk

错误类型错误：无法读取属性＆＃39;值＆＃39;未定义的

1 个答案: