angular2-forms

问题 I created a custom input component but I want to work with errors inside the component. So to make validation work I need to get errors from control object. Is it possible? I did my component exactly like here. Top part of the component: @Component({ selector: 'sc-input', styles, template: ` <label class="label"> <ng-content></ng-content> <input class="input" [(ngModel)]='value' [attr.name]='name' [attr.type]='type' (blur)='onBlur($event)' (focus)='onFocus($event)'> <div class="errors"> <div

问题 I recently have started to learn Angular 2 and I am struggling to understand how I should properly connect the changes that occurred in outside world to Angular Reactive Forms. Specifically, I have an issue with the following example: I want to create a directive that enhances input with autocomplete functionality that provided by typeahead jQuery plugin. My directive looks like the following: @Directive({ selector: '[myTypeahead]' }) class TypeAheadDirective implements AfterViewInit {

问题 I store 2 keys in localStorage and I'd like to display one of them in my template. I can't access these values. I even created an interface just to store the value of the currentUser key from localStorage. How should implement it? Here's the current code: Service import { Injectable } from '@angular/core'; import { Http } from '@angular/http'; import { Md5 } from 'ts-md5/dist/md5'; import { User } from './user'; import 'rxjs/add/operator/map'; @Injectable() export class VehicleService {

问题 I have an *ngFor child row component in a table that I need to wrap with a FormGroup. Something like this. <tr [formGroup]='dependentForm'> <td> <input type="text" formControlName="first_name"> </td> <td> <input type="text" formControlName="last_name"> </td> <td> <input type="text" formControlName="dob"> </td> </tr> But I can't figure out how to load the component from the parent template without it messing up the header columns alignment. I've tried with an element selector and an attribute

问题 Given the following... .html <form (ngSubmit) = "onSubmit()" #heroForm = "ngForm"> {{diagnostic}} <div class = "form-group"> <label for = "name">Name</label> <input type = "text" class = "form-control" required [(ngModel)] = "model.name" ngControl = "name" #name = "ngForm" #spy> <p *ngIf = "name.dirty" class = "alert alert-danger"> Name is required </p> <!--<p [hidden] = "name.dirty"--> <!--class = "alert alert-danger">--> <!--Name is required--> <!--</p>--> </div> .. ..is it possible to get

问题 I am trying to create a select component wrapper in Angular 2 using ngModel. The events all fire off correctly once the selection is changed but I cannot set the initial selection when it's rendered. This is my component: @Component({ selector: 'my-dropdown', inputs: ['selectedItem', 'items', 'label'], outputs: ['selectedItemChange'], template: ` <div class="field"> <label>{{label}}</label> <select class="ui search selection dropdown" [ngModel]="selectedItem" (change)="onChange($event.target

问题 Here i wrote a small Validation Property for EName Validation when i try 2 Load Html page i'm getting Error as 'ngClass' since it isn't a known property of 'div'. ( Component.ts import { Component, OnInit } from "@angular/core" import { Employee } from "../../../templates/employee/employee" import { Validators, FormGroup, FormBuilder } from "@angular/forms" @Component({ selector: "customer-ui", templateUrl: "../../../templates/customer/customer.html" }) export class JamComponent implements

问题 So I used the guide here: https://angular.io/docs/ts/latest/cookbook/dynamic-form.html I need to add more fields to an existing field. I've made something that works, but it's clunky and it resets the form when I hit it. Code below: In dynamic-form.component.ts: add_textbox() { this.questions.push(this.questionService.create_textbox({key: "test", label: "Test"})); console.log(this.questions); this.form = this.qcs.toFormGroup(this.questions); } In question.service.ts create_textbox({key, value

问题 I am trying to check whether a form is valid or not to prevent further execution if it is not. Here is my form: <form (ngSubmit)="updateFirstName(firstNameForm)" #firstNameForm="ngForm" novalidate> <div class="form-group" ng-class="getCssClasses(formCtrl, formCtrl.firstName)"> <div class="input-group"> <input type="text" ngControl="firstName" #firstName="ngForm" required minlength="2" maxlength="35" pattern_="FIRST_NAME_PATTERN" [ngModel]="currentUserAccount?.firstName" (ngModelChange)=

问题 I have a text input and i'm listening for the changes. mycomponent.ts ngOnInit() { this.searchInput = new Control(); this.searchInput.valueChanges .distinctUntilChanged() .subscribe(newValue => this.search(newValue)) } search(query) { // do something to search } mycomponent.html <search-box> <input type="text" [ngFormControl]="searchInput" > </search-box> Running the application everything works fine, but i want to unit-test it. So here's what i tried mycomponent.spec.ts beforeEach(done => {