如何正确初始化angular5中的对象?

时间:2018-03-31 05:32:35

标签: angular typescript angular5

我正在尝试使用动态表单方法创建问卷服务。 所以我有问题基础然后我有问题文本框,问题dropdwon等在它上面。

然后我决定创建一个问卷对象,其中包含一系列问题和信息,如身份证,海报等。

然而,当我在question.service.ts中调用add()函数时,它表示没有定义问卷调查。

我想我的问题是我在问卷调查表中成功制作了一个问卷调查实例吗?或者我在question.service.ts中错误地引用了它?

问题-base.ts

export class QuestionBase<T>{
  value: T;
  key: string;
  label: string;
  required: boolean;
  order: number;
  controlType: string;

  constructor(options: {
      value?: T,
      key?: string,
      label?: string,
      required?: boolean,
      order?: number,
      controlType?: string
    } = {}) {
    this.value = options.value;
    this.key = options.key || '';
    this.label = options.label || '';
    this.required = !!options.required;
    this.order = options.order === undefined ? 1 : options.order;
    this.controlType = options.controlType || '';
  }
}

问题-textbox.ts

import { QuestionBase } from './question-base';

export class TextboxQuestion extends QuestionBase<string> {
  controlType = 'textbox';
  type: string;

  constructor(options: {} = {}) {
    super(options);
    this.type = options['type'] || '';
  }
}

question.service.ts

// this is where form consumes external data

import { Injectable }       from '@angular/core';

import { DropdownQuestion } from './question-dropdown';
import { QuestionBase }     from './question-base';
import { TextboxQuestion }  from './question-textbox';
import { QuestionnaireObj } from './questionnaireObj';


@Injectable()
export class QuestionService {

  // Todo: get from a remote source of question metadata
  // Todo: make asynchronous
  // const newQuestion = new TextboxQuestion() {
// constructor(){}



  add(){

    let newQuestion: QuestionBase<any>[] = [

      new DropdownQuestion({
        key: 'yes',
        label: 'Bravery Rating',
        options: [
          {key: 'solid',  value: 'Solid'},
          {key: 'great',  value: 'Great'},
          {key: 'good',   value: 'Good'},
          {key: 'unproven', value: 'Unproven'}
        ],
        order: 3
      })
    ]

    console.log("newQuestion is" + newQuestion);
    // QuestionService.questionList.append(newQuestion);
    console.log(questionnaireobj);


  }


  getQuestions() {

    let questions: QuestionBase<any>[] = [

      new DropdownQuestion({
        key: 'brave',
        label: 'Bravery Rating',
        options: [
          {key: 'solid',  value: 'Solid'},
          {key: 'great',  value: 'Great'},
          {key: 'good',   value: 'Good'},
          {key: 'unproven', value: 'Unproven'}
        ],
        order: 3
      }),

      new TextboxQuestion({
        key: 'firstName',
        label: 'First name',
        value: 'Bombasto',
        required: true,
        order: 1
      }),

      new TextboxQuestion({
        key: 'emailAddress',
        label: 'Email',
        type: 'email',
        order: 2
      })
    ];

    return questions.sort((a, b) => a.order - b.order);
    // console.log(questions);

  }
}

questionnaireObj.ts

import { DropdownQuestion } from './question-dropdown';
import { QuestionBase }     from './question-base';
import { TextboxQuestion }  from './question-textbox';
import { Injectable }       from '@angular/core';


@Injectable()
export class QuestionnaireObj {

// public questionnaireId?: number;
// public questionList?: QuestionBase<any>[];


// declare the fields and init
constructor(public questionnaireId?:number, public questionList?: QuestionBase<any>[]) { }



let questionnaireobj = new QuestionnaireObj();

questionnaireobj.questionnaireId = 1;
questionnaireobj.questionList = [];

}

1 个答案:

答案 0 :(得分:0)

questionnaireObj.ts

import {DropdownQuestion} from './question-dropdown';
import {QuestionBase} from './question-base';
import {TextboxQuestion} from './question-textbox';
import {Injectable} from '@angular/core';


@Injectable()
export class QuestionnaireObj {

  questionnaireId: number = 1;
  questionList: QuestionBase<any>[] = [];

  constructor() {
  }

}

我仍然不知道你想做什么。你说“当我在question.service.ts中调用add()函数时,它表示没有定义问卷调查。”但是在question.service.ts文件中没有问卷调查的实例。