网站搜索

angular - 在 NgModule 绑定 angular4 上使用 get/set


我有一个类,其中有一个字段是 JSON 对象,我需要将这个 JSON 显示在一个文本区域中。所以我创建了一个 set/get 方法来处理这种行为。

我的班级:

class Element {

 property: string;
 value: string;

  constructor(property: string,value: string){

    this.property = property;
    this.value = value;
  }
}

class Model {

   elements: Element[];

   constructor(elements?: Element) { 
       this.elements = elements;
   }

   get elementsValue() {
       return JSON.stringify(this.elements, null, 2);
   }
   set elementsValue(value: string) {
       this.elements = JSON.parse(value);
   }

}

我的组件:

  @Component({
      selector: 'my-app',
      providers: [],
      template: `
        <div *ngFor="let model of models">
             <textarea [(ngModel)]='model.elementsValue' rows="30" cols="120"></textarea>
        </div>  `,
      directives: []
    })
    export class App {

      models = [
          new Model([new Element("test","value"),new Element("test","value")]),
          new Model()
      ]
    }

elementsValue 的值没有绑定到文本区域。文本区域是空的

我已经使用这块木板作为模板。

答案#1

<div *ngFor="object of objects">

尝试

<div *ngFor="let object of objects">

答案#2

你在 Model 类中的 constructor 只期望一个 Element 作为参数。尝试将该参数改为元素数组

constructor(elements?: Element[]) {
   this.elements = elements;
}