首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >从后端初始化表单值

从后端初始化表单值
EN

Stack Overflow用户
提问于 2017-01-25 17:10:46
回答 2查看 1K关注 0票数 1

我有下面的服务来获取数据。我得到了预期的数据

代码语言:javascript
复制
export class UserService {
user: User
    private userSource = new Subject<User>();
    currentUser = this.userSource.asObservable();

constructor(http: Http){}

resolve(route: ActivatedRouteSnapshot){
      return this.http.get('/getUserData')
        .map(output => {
            console.log("IN RESOLVE. OUTPUT = ");
            console.log(output as User);        // Getting output here as expected
            return output as User;
        })
 }}

用户模型

代码语言:javascript
复制
export clsss User {
constructor(public Basic: {mob: string; email: string},
        public other: {abc: string; xyz: string  }) {}

BasicComponent.ts

代码语言:javascript
复制
export class BasicComponent implements OnInit {
basicForm: FormGroup;
user: User;

constructor(private fb: FormBuilder, public userService: UserService) { }

ngOnInit() {
        this.userService.currentUser.subscribe(
            result => {
              console.log(result)
             this.user = result
            })
        this basicForm = this.fb.group({
              mob: [this.user.mob, Validators.compose([Validators.required, Validators.minLength(10)],
              email: ['', Validators.compose([Validators.required, EmailValidator.isValidMailFormat])]
        })
}}

我希望预先填充这些值。但user对象显示的是undefined。这是最小的代码。我还有像BasicComponent这样的其他组件,每个组件都有forms。我已经包含了所有依赖项和其他声明。它工作得很好,除了我在Formbuilder中没有获得用户对象

我错过了什么?

EN

回答 2

Stack Overflow用户

发布于 2017-01-25 17:13:36

代码语言:javascript
复制
export class BasicComponent implements OnInit {
basicForm: FormGroup;
user: User;

constructor(private fb: FormBuilder, public userService: UserService) { }

ngOnInit() {
        let __self = this;
        this.userService.currentUser.subscribe(result => {
             console.log(result)
             __self.user = result;
             __self contact = __self.fb.group({
                    mob: [__self.user.mob, Validators.compose([Validators.required, Validators.minLength(10)],
                    email: ['', Validators.compose([Validators.required, EmailValidator.isValidMailFormat])]
                });
            });
}}
票数 0
EN

Stack Overflow用户

发布于 2017-01-25 18:04:00

尝试此方法

代码语言:javascript
复制
 ngOnInit() {
        // Build the form
        this.basicForm = this.fb.group({
            'business_name' : ['', Validators.required],
            'email'   : ['', Validators.required],
        });
        // Fetch data for the view
         this.userService.currentUser.subscribe(
            result => {
              console.log(result)
             this.user = result

             this.basicForm.setValue({
                business_name: response.data.business.business_name,
                email: response.data.business.email
            });


        })
    }
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/41847465

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档