Question

我将一个带有输入形式的组件注入到ionic2形式中，两者都是用formBuilder创建的。

从地址输入组件（search-map.ts）：

@Component({
    selector: 'search-map',
    templateUrl: 'search-map.html'
})

@NgModule({
    schemas: [ CUSTOM_ELEMENTS_SCHEMA ]
})

export class SearchMap {        
    public searchMapForm = this.formBuilder.group({
        country: ["DE"],
        postcode: ["", this.searchCont],
        city: [""],
    });
(...)

插入基本表单的HTML（signup.html）：

(...)
    <ion-item>
      <ion-label floating>Password</ion-label>
      <ion-input type="password" formControlName="password"></ion-input>
    </ion-item>

    <search-map></search-map>
(...)

从基本表单（signup.ts）

ionViewWillLoad() {
    this.signup = this.formBuilder.group({
        name: [this.name, Validators.required],
        fullname: [this.fullname, Validators.compose([Validators.required, Validators.pattern('^[\\w-äöüßÄÖÜ]+(\\s[\\w-äöüßÄÖÜ]+)+$')])],
        email: [this.email, Validators.compose([Validators.required, Validators.pattern('^(([^<>()\\[\\]\\\\.,;:\\s@"]+(\\.[^<>()\\[\\]\\\\.,;:\\s@"]+)*)|(".+"))@((\\[[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}])|(([a-zA-Z\\-0-9]+\\.)+[a-zA-Z]{2,}))$')])],
        password: ['', Validators.compose([Validators.required, Validators.minLength(8)])],
        passwordRepeat: ['', this.passwordCompare],
        address: [this.address, Validators.required],
    });
}

编辑和更改事件在两者上都正常。

如何从signup.ts文件（class signupPage）中读取国家/地区和邮政编码输入字段？

Answer 1

在您设置搜索地图的html中，执行以下操作：

<search-map #searchMap></search-map>

在SignupPage类中，将searchMap声明为

@ViewChild(SearchMap)
searchMap:SearchMap;

通过这种方式，您可以访问父项中的子组件和子项的所有公共属性。（您可能必须使searchMapForm成为searchmap类的公共属性）

检查here for more

如何访问注入表单组件的输入字段

1 个答案: