小编AJT*_*T82的帖子

使用嵌套表单组处理Angular2 - 4错误

伙计我需要一些Angular 4反应形式的帮助.我有嵌套的表单组也可以正常工作,除了验证.但是当我尝试在我的html标记中添加一些处理验证时,我的应用程序崩溃了.

我的组件代码如下:

createForm() {
    let options: any = {};

    for (let option of this.annoucementOptions) {
        options[option.title] = new FormControl(false);
    }

    let optionsFormGroup: FormGroup = new FormGroup(options);

    this.annoucementForm = this.fb.group({
        address: this.fb.group({
            country: ['', [Validators.maxLength(50)]],
            state: ['', [Validators.maxLength(50)]],
            city: ['', [Validators.required, Validators.maxLength(50)]],
            street: ['', [Validators.required, Validators.maxLength(50)]],
            apartment: ['', [Validators.required, Validators.maxLength(50)]],
        }),
        description: this.fb.group({
            title: ['', [Validators.required, Validators.maxLength(80)]],
            shortDescription: [''],
            livingPlaces: [''],
            room: [''],
            options: optionsFormGroup
        }),
        priceBlock: this.fb.group({
            price: ['', [Validators.required, Validators.maxLength(80)]],
            type: ['', [Validators.required, Validators.maxLength(80)]],
        }),
    });
}
Run Code Online (Sandbox Code Playgroud)

这是我的模板代码: …

validation reactive-forms angular

1
推荐指数
1
解决办法
1664
查看次数

Angular 2错误永远不会到达自定义错误处理程序

我有最简单的Angular(v2.4.3)自定义错误处理程序的实现,但仍然无法记录错误.有什么不对?

app.module.ts

providers: [
    { provide: ErrorHandler, useClass: MyErrorHandler }
]
Run Code Online (Sandbox Code Playgroud)

我的错误,handler.ts

import { ErrorHandler, Injectable} from '@angular/core';

@Injectable()
export class MyErrorHandler extends ErrorHandler {

  constructor(private errorHandlerService: ErrorHandlerService) {
    super();
  }

  public handleError(error: any): void {
    console.log('error'); // nothing
  }
}
Run Code Online (Sandbox Code Playgroud)

sample-service.ts(试图抛出错误)

  addSomething(data) {
    let bodyString = JSON.stringify(data);
    let headers = new Headers({ 'Content-Type': 'application/json' });
    let options = new RequestOptions({ headers: headers });

    return this.http.post(this.url + 'expense', bodyString, options)
      .map((res: Response) => res.json())
      .catch(this.handleError);
  }

  private handleError(error: any) { …
Run Code Online (Sandbox Code Playgroud)

error-handling observable angular

1
推荐指数
1
解决办法
3024
查看次数

Angular 2 - 表单构建器循环遍历数组,然后循环内部数组

我有以下JSON,我希望将其映射到一个表单:

{
  "lineItemId": 0,
  "count": 0,
  "fixtures": [
    {
      "fixtureId": 0,
      "fixtureName": "string",
      "total": 0,
      "completed": 0,
      "guestDetails": [
        {
          "id": 0,
          "forename": "string",
          "surname": "string",
          "email": "string",
          "telephone": "string",
          "specialInstructions": "string",
          "completed": true,
          "dietaryRequirements": [
            {
              "id": 0,
              "name": "string",
              "isRequired": true
            }
          ]
        }
      ]
    }
  ]
}
Run Code Online (Sandbox Code Playgroud)

然后我有以下工作打字稿,将其映射到formbuilder:

this.myForm = this.fBuilder.group({
   guestDetailsForm: this.fBuilder.array([])
});

this.httpService.getGuestDetails(this.eventId, this.passedIdValue)
   .subscribe(data => {
      this.fixturesArray = data.fixtures;
      console.log(this.fixturesArray);
      this.fixturesArray.forEach(fixturesArrayElement => {
          this.guestDetailsArray = fixturesArrayElement.guestDetails;
          this.guestDetailsArray.forEach(element => {
            (<FormArray>this.myForm.get('guestDetailsForm')).push(this.fBuilder.group({
            id: [element.id],
            forename: [element.forename], …
Run Code Online (Sandbox Code Playgroud)

typescript angular

1
推荐指数
1
解决办法
2657
查看次数

如何使用angularjs基于paritcular值拼接数组

我正在使用angularjs,我在范围内有一个数组.我需要删除No=1范围内有大量数据的对象.我需要删除特定值称为'1'.

请帮助如何实现这一目标.

    var data=[
      {
         "No":1,
        "PatientState": "AK",
        "DispenseMonth": "7/1/2016" 

      },
      {
        "No":2,
        "PatientState": "AK",
        "DispenseMonth": "8/1/2016" 
      },
      {
         "No":1,
        "PatientState": "AK",
        "DispenseMonth": "9/1/2016" 
      },
      {
        "No":1,
        "PatientState": "AK",
        "DispenseMonth": "10/1/2016" 
      },
      {
        "No":4,
        "PatientState": "AK",
        "DispenseMonth": "11/1/2016" 
      },
      {
        "No":1,
        "PatientState": "AK",
        "DispenseMonth": "2/1/2017" 
      },
      {
         "No":5,
        "PatientState": "AK",
        "DispenseMonth": "3/1/2017" 
      }
        ]

        $scope.StateInformations =data;
Run Code Online (Sandbox Code Playgroud)

javascript arrays angularjs

1
推荐指数
1
解决办法
246
查看次数

angular 2 - ngForm.value 没有 ngControl 成员

我有以下表格:

import { Component } from '@angular/core'

@Component({
    selector: 'form1',
    template: `
      <div >
        <form (ngSubmit)="onSubmit(f)" #f="ngForm">
           <input ngControl="email" type="text" id="mail" required>                              
           <input ngControl="password" type="text" id="password" required>
           <input ngControl="confirmPass" type="text" id="confirmPass" required>                                
           <button type="submit">Submit </button>
        </form>
      </div>                    `
})
export class Form1Component{
    onSubmit(form:any){
      console.log(form.value);
    }
}
Run Code Online (Sandbox Code Playgroud)

问题是form.value只有一个空对象并且没有ngControl指令值的迹象。我错过了什么吗?

ng-submit angular2-forms angular

1
推荐指数
1
解决办法
2983
查看次数

ngClass在角度4中不起作用

ngClass指令生成以下错误

ERROR Error: Uncaught (in promise): Error: Template parse errors:
Can't bind to 'ngClass' since it isn't a known property of 'li'.
Run Code Online (Sandbox Code Playgroud)

代码段.

 <li [ngClass]="{'active':true}"><a href="">Home</a></li>
Run Code Online (Sandbox Code Playgroud)

注意:我已经导入了通用模块

import {CommonModule} from "@angular/common"
Run Code Online (Sandbox Code Playgroud)

库版本角4.0.1

javascript angular-ng-class angular

1
推荐指数
1
解决办法
3610
查看次数

如何在ng-bind angularjs中使用toFixed(2)

我使用ng-bind来绑定价格的价值

 <td><span ng-bind="'$' o.Price"></span></td>
Run Code Online (Sandbox Code Playgroud)

但它取值 如此值281.96000000000004所以如何在视图中限制此值,因此它只需要十进制后的两位数.像281.96.

javascript jquery angularjs

1
推荐指数
1
解决办法
475
查看次数

从ngrx /存储获取数据

使用简单类型,所有方法都可以正常工作,但是我无法使用对象。

这是我的减速器:

import { Action } from '@ngrx/store'
import { RssFeed } from "../rss/rss";

export interface AppState {
  demoData: number;
  feeds: RssFeed[];
}

const initialState: AppState = {
  demoData: 0,
  feeds: []
};

export const INCREMENT = 'INCREMENT';
export const DECREMENT = 'DECREMENT';

export function feedsReducer(state: AppState = initialState, action: Action): AppState {

  switch(action.type) {
    case INCREMENT: {

      return {
        demoData: state.demoData + 1,
        feeds: []
      }
    }
    case DECREMENT: {

        return {
          demoData: state.demoData - 1,
          feeds: []
        } …
Run Code Online (Sandbox Code Playgroud)

ngrx angular

0
推荐指数
1
解决办法
6127
查看次数

$ http.get()错误:$ http.get不是函数

我正在创建一个dataService来处理所有的http连接,这是我的代码:

(function(){
angular.module('theswapp')
       .factory('dataService',['$http','$q',function($q, $http){

        function getTeamCheckInData(){
            return $http.get('assets/js/data.json');
        }

        return {
            getTeamCheckInData : getTeamCheckInData
        };

  }]);
})();
Run Code Online (Sandbox Code Playgroud)

在我的控制器中注入它并对其进行调用后,我在返回时遇到错误$ http.get('assets/js/data.json'); .Error$ http.get不是一个函数

http angularjs angular-services

0
推荐指数
1
解决办法
475
查看次数