Hello everyone! I’m starting a project with Nativescript and I love it, but it seems a little bit difficult for me. At the moment I’m trying to make a page to create a user. This is my create.user.component.ts
import { Component } from '@angular/core';
import { RouterExtensions } from 'nativescript-angular/router';
import firebase = require('nativescript-plugin-firebase');
@Component({
selector:'create-user',
template:`
<StackLayout>
<Label class="titulo" text="Create User"></Label>
<TextField hint="Email" keyboardType="text" [(ngModel)]="email"
autocorrect="false" autocapitalizationType="none"></TextField>
<TextField hint="Password" secure="true" [(ngModel)]="password"
autocorrect="false" autocapitalizationType="none"></TextField>
<Button class="submit-botton" (tap)="create()" text="Crear usuario"></Button>
</StackLayout>
`,
styleUrls:['login/login.component.css']
})
export class CreateUserComponent{
email:string;
password:string;
constructor(private routerExt: RouterExtensions ){}
create(){
firebase.createUser({
email:this.email,
password: this.password
}).then(
(result)=>{
this.routerExt.navigate(["/chatListado"],{
transition:{
name: "flip",
duration:500,
curve:"linear"
}
});
console.log("User Created");
},
(errorMessage)=>{
alert('error: ' + errorMessage);
}
);
}
}
At the beginning when I tap the button to create it, the email and password returns undefined. I couldn’t get the email and the password and after searching I observed that I needed to import the NativeScriptFormsModule in my app.module.ts so I made it.
app.module.ts
import { NgModule, NO_ERRORS_SCHEMA } from "@angular/core";
import { NativeScriptModule } from "nativescript-angular/nativescript.module";
//use the data binding
import { NativeScriptFormsModule} from "nativescript-angular/forms"
import { AppRoutingModule } from "./app.routing";
import { AppComponent } from "./app.component";
//login
import { LoginComponent } from "./login/login.component";
import { Login} from './login/login';
import { CreateUserComponent } from './login/create.user.component';
@NgModule({
bootstrap: [
AppComponent
],
imports: [
NativeScriptModule,
AppRoutingModule,
NativeScriptFormsModule
],
declarations: [
AppComponent,
LoginComponent,
CreateUserComponent
],
providers: [
],
schemas: [
NO_ERRORS_SCHEMA
]
})
export class AppModule { }
With this theoretically it should work but now when I start the app I get this error on my console:
JS: ERROR Error: Uncaught (in promise): Error: No value accessor for form control with unspecified name attribute JS: Error: No value accessor for form control with unspecified name attribute JS: at _throwError (file:///data/data/com.Mystory.android/files/app/tns_modules/@angular/forms/bundles/forms.umd.js:1838:11) [angular] JS: at setUpControl (file:///data/data/com.Mystory.android/files/app/tns_modules/@angular/forms/bundles/forms.umd.js:1751:9) [angular] JS: at NgModel._setUpStandalone (file:///data/data/com.Mystory.android/files/app/tns_modules/@angular/forms/bundles/forms.umd.js:4320:9) [angular] JS: at NgModel._setUpControl (file:///data/data/com.Mystory.android/files/app/tns_modules/@angular/forms/bundles/forms.umd.js:4306:37) [angular] JS: at NgModel.ngOnChanges (file:///data/data/com.Mystory.android/files/app/tns_modules/@angular/forms/bundles/forms.umd.js:4237:18) [angular] JS: at checkAndUpdateDirectiveInline (file:///data/data/com.Mystory.android/files/app/tns_modules/@angular/core/bundles/core.umd.js:10715:19) [angular] JS: at checkAndUpdateNodeInline (file:///data/data/com.Mystory.android/files/app/tns_modules/@angular/core/bundles/core.umd.js:12097:17) [angular] JS: at checkAndUpdateNode (file:///data/data/com.Mystory.android/files/app/tns_modules/@angular/core/bundles/core.umd.js:12065:16) [angular] JS: at debugCheckAndUpdateNode (file:///data/data/com.Mystory.android/files/app/tns_modules/@angular/core/bundles/core.umd.js:12694:59) [angular] JS: at debugCheckDirectivesFn (file:///data/data/com.Mystory.android/files/app/tns_modules/@angular/core/bundles/core.umd.js:12635:13) [angular] JS: at Object.eval [as updateDirectives] (ng:///AppModule/LoginComponent.ngfactory.js:363:5) [angular] JS: at Object.debugUpdateDirectives [as updateDirectives] (file:///data/data/com.Mystory.android/files/app/tns_modules/@angular/core/bundles/core.umd.js:12620:21) [angular] JS: at checkAndUpdateView (file:///data/data/com.Mystory.android/files/app/tns_modules/@angular/core/bundles/core.umd.js:12032:14) [angular] JS: at callViewAction (file:///data/data/com.Mystory.android/files/app/tns_modules/@angular/core/bundles/core.umd.js:12347:17) [angular]
And now I can not go to the page to create the user… When I tap the button to go to the page to create the user I get this error on my app:
An uncaught Exception occurred on "main" thread.
com.tns.NativeScriptException:
Calling js method onClick failed
TypeError: Cannot read property 'startsWith' of undefined
File: "file:///data/data/com.Mystory.android/files/app/tns_modules/@angular/core/bundles/core.umd.js, line: 13024, column: 8
StackTrace:
Frame: function:'UrlParser.peekStartsWith', file:'file:///data/data/com.Mystory.android/files/app/tns_modules/@angular/router/bundles/router.umd.js', line: 1181, column: 80
Frame: function:'UrlParser.consumeOptional', file:'file:///data/data/com.Mystory.android/files/app/tns_modules/@angular/router/bundles/router.umd.js', line: 1187, column: 18
Frame: function:'UrlParser.parseRootSegment', file:'file:///data/data/com.Mystory.android/files/app/tns_modules/@angular/router/bundles/router.umd.js', line: 1018, column: 14
Frame: function:'DefaultUrlSerializer.parse', file:'file:///data/data/com.Mystory.android/files/app/tns_modules/@angular/router/bundles/router.umd.js', line: 885, column: 30
Frame: fun
Someone knows what is happening here? If I’m missing something or something like that? I’m stacked with this since 2 or 3 days and I need some help…
Thanks and sorry for my bad English!