Question

我有一个textarea，我正在尝试将更新推送到该字段。我似乎无法弄清楚如何做到这一点。我成功地让我的组合框将所选项目传递给dropdownSourceSelected。从那里我想： 1）更新textarea字段 2）清除组合框值（将其返回到undefined，使占位符返回

我无法弄清楚如何做到这一点。我已经看到了使用$ scope的引用，但是当我尝试这个时，我得到一个关于$ scope未知的错误。

table-widget.component.html
      <textarea vertical-align:top ng-model="filterSelection" readonly name="selectedfilters" cols = "50" rows = "1"></textarea>

table.component.ts
  public dropdownSourceSelected(selection: string): void  {
    if (this.filterSelection != '')
      this.filterSelection += '&';
    this.filterSelection += "source=";
    this.filterSelection += selection;
    console.log('filter selection: ', this.filterSelection);
  }

Answer 1

此代码：

ng-model="filterSelection"

需要这样：

[(ngModel)]="filterSelection"

FYI $scope是AngularJS（v1）。 AngularJS和Angular具有非常不同的语法，因此您在AngularJS中使用解决方案找到的任何帖子都无法在Angular中使用。

要在嵌套组件中设置属性，请在组件中使用@Input属性，并使用HTML中的属性绑定设置该属性。所以像这样：

import { Component, OnChanges, Input, EventEmitter, Output } from '@angular/core';

@Component({
    selector: 'pm-star',
    templateUrl: './star.component.html',
    styleUrls: ['./star.component.css']
})
export class StarComponent implements OnChanges {
    @Input() rating: number;
    starWidth: number;
    @Output() ratingClicked: EventEmitter<string> =
            new EventEmitter<string>();

    ngOnChanges(): void {
        this.starWidth = this.rating * 86 / 5;
    }

    onClick(): void {
        this.ratingClicked.emit(`The rating ${this.rating} was clicked!`);
    }
}

然后设置如下评级属性：

                        <pm-star [rating]='product.starRating'
                            (ratingClicked)='onRatingClicked($event)'>
                        </pm-star>

组件的角度更新textarea字段

1 个答案: