angular2-forms

问题 I want to create a form where the user will enter his email. I'd like to validate email format client-side. Is there any generic email validator in Angular 2? NB: Something similar to AngularJS validator. 回答1: You can use Form Directives and Control to do this. export class TestComponent implements OnInit { myForm: ControlGroup; mailAddress: Control; constructor(private builder: FormBuilder) { this.mailAddress = new Control( "", Validators.compose([Validators.required, GlobalValidator

问题 I am working on a login form and if the user enters invalid credentials we want to mark both the email and password fields as invalid and display a message that says the login failed. How do I go about setting these fields to be invalid from an observable callback? Template: <form #loginForm="ngForm" (ngSubmit)="login(loginForm)" id="loginForm"> <div class="login-content" fxLayout="column" fxLayoutAlign="start stretch"> <md-input-container> <input mdInput placeholder="Email" type="email" name

问题 I'm making a dynamic form. A Field has a list of values. Each value is represented by a string. export class Field{ name: string; values: string[] = []; fieldType: string; constructor(fieldType: string) {this.fieldType = fieldType;} } I have a function in my component which adds a new value to the field. addValue(field){ field.values.push(""); } The values and the button are displayed like this in my HTML. <div id="dropdown-values" *ngFor="let value of field.values; let j=index"> <input type=

问题 I am trying to fire click event (or any other event) on element programatically , In other word I want to know the similar features as offered by jQuery .trigger() method in angular2. Is there any built in method to do this? ..... if not please suggest how can i do this Consider the following code fragment <form [ngFormModel]="imgUploadFrm" (ngSubmit)="onSubmit(imgUploadFrm)"> <br> <div class="input-field"> <input type="file" id="imgFile" (click)="onChange($event)" > </div> <button id="btnAdd

问题 Going around in circles here. Very new to Typescript and it's causing major headaches with trivial implementations. How do a define in AgentStatusService that it should have an array of 4 options called ['offline','available','busy','away'] ? AgentStatus is defined ( or is it? ) and I am injecting it into the AgentStatusService . Microsoft Visual Studio Code is barfing on line 21 where the type 'typeof AgentStatus' is not assignable to type 'AgentStatus'... why? Updated: import { EventEmitter

问题 I'm new to angular 2. I have a table, which on click of 'add consignment' option, it adds a new row with serial number and multiple input slots. Now on adding more consignments (which adds more rows of multiple input slots in table), and entering information to all these rows and submitting, only the values of last row is being returned. Can someone please tell me how to return the values of all the multiple input rows from the table as one single object? Thank you. Below is my code: Template

问题 Here is Json schema : { "_id" : ObjectId("59031d77fd5e1c0b3c005d15"), "resume_data" : { "work_experience" : [ { "company" : "example", "website" : "example.com", "position" : "Internship", "highlights" : "Learn To Create API In Laravel Framework. and also Learn Angular 2 for Front end Development.", "project_experience" : [ { "projectName" : "Fb Project", "teamMember" : "5", "technology" : "PHP,Laravel-5,Angular-2,MongoDb", "projectPosition" : "Back-end Developer" } ] } ] } } Here is image: I

问题 How can we toggle a button to Yes/No based on JSON response in angular 2? 回答1: Use following code to toggle button import {Component, NgModule, VERSION} from '@angular/core' import {BrowserModule} from '@angular/platform-browser' @Component({ selector: 'my-app', template: ` <div> <button *ngIf='toggleButton' (click)='toggleButton = false'>Button One</button> <button *ngIf='!toggleButton' (click)='toggleButton = true'>Button Two</button> </div> `, }) export class App { name:string;

问题 In Angular 2 is it advisable to use a component method in an expression? For example, I have the following component export class AreaComponent { totalLength: number; totalBreadth: number; totalheight: number; mylocalVar: number; totalSqft: number; myMethod(): number { let totalArea = this.totalLength * this.totalBreadth * this.totalheight; let myVar = 0; switch (this.mylocalVar) { case 0: myVar = 8; break; case 1: myVar = 9; break; case 2: myVar = 10; break; } this.totalSqft = totalArea *

问题 I'm trying to bind a data from input on Angular 2 but I'm having some problems. Here is the html code: <input type="text" class="animated bounceIn input-proposta" placeholder="Insira sua proposta" [(ngModel)]="proposta.proposta_usuario" > <input type="button" (click)="enviaProposta(proposta)" class="botao-medio btn-aceita" value="Enviar Proposta" > and here's the component (I have created a interface for "proposta" in which I have two properties: 'proposta_usuario' and 'proposta_cliente')