小编Pen*_*gyy的帖子

我是Angular的新手.我开始了英雄之旅来学习它.所以,我创建了一个app.component具有two-way约束力.

import { Component } from '@angular/core';
export class Hero {
    id: number;
    name: string;
}
@Component({
    selector: 'app-root',
    template: `
        <h1>{{title}}</h1>
        <h2>{{hero.name}}  details!</h2>
        <div><label>id: </label>{{hero.id}}</div>
        <div><label>Name: </label>
            <input [(ngModel)]="hero.name" placeholder="Name">
        </div>
    `,
    styleUrls: ['./app.component.css']
})
export class AppComponent {
    title = 'Tour of Heroes';
    hero: Hero = {
        id: 1,
        name: 'Windstorm'
    };
}

在本教程之后,我导入了FormsModule并将其添加到声明数组中.此步骤出现错误:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { …

在角度2我使用

ng g c componentname

但它在Angular 4中不受支持,因此我手动创建它,但它显示错误,它不是模块.

我的app.module.ts中有这个:

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { HttpModule, Http } from '@angular/http';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { EliteApi } from '../shared/shared';
import { MyApp } from './app.component';
import { MyTeams, Tournaments, TeamDetails, Teams, TeamHome, Standings } from '../pages/pages';

import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';

@NgModule({
    declarations: [
        MyApp,
        MyTeams,
        TeamDetails,
        Tournaments,
        Teams,
        TeamHome,
        Standings
    ],
    imports: [
        BrowserModule,
        IonicModule.forRoot(MyApp),
        HttpModule …

我刚刚复制并粘贴了datePicker和输入的角度材料代码,但是我收到了datePicker的这个错误.

app.module

import {MaterialModule} from '@angular/material';
@NgModule({
imports: [
...
MaterialModule
]

<md-input-container>
    <input mdInput placeholder="Rechercher" [(ngModel)]="filterHistorique">
</md-input-container>

<md-input-container>
    <input mdInput [mdDatepicker]="picker" placeholder="Choose a date">
    <button mdSuffix [mdDatepickerToggle]="picker"></button>
</md-input-container>
<md-datepicker #picker></md-datepicker>

这是我在浏览器中出现的错误:

无法绑定到'mdDatepicker',因为它不是'input'的已知属性如果'md-datepicker'是Angular组件,则验证它是否是此模块的一部分.2.如果'md-datepicker'是Web组件,则将"CUSTOM_ELEMENTS_SCHEMA"添加到此组件的'@NgModule.schemas'以禁止显示此消息.("[错误 - >]

错误是针对datepicker,当我删除它时,错误消失

与此问题类似

我正在运行以下命令来lint我的angular2 typeScript代码.

ng lint

它很好地证明了所有的掉毛错误.

但我希望我的供应商文件夹(假设"src/app/quote/services/generated/**/*")不应该包含在内衬时.

我知道这可以用tslint命令完成,如下所示(参考这里)

tslint \"src/**/*.ts\" -e \"**/__test__/**\"

但在角度cli中,参数是什么？如何从tslint中排除一些文件？

注意:我的Angular Cli版本是:@ angular/cli:1.0.0-rc.0

道歉,因为我无法想到包含所有信息的更好方法......当我运行这个时,我得到一个错误说明如下.我跟着Ionic Docs到了T,我无法弄清楚什么可能是错的.

错误:

没有AngularFireDatabase的提供者!

的package.json

App.module.ts

Home.html中

Home.ts

使用时选择验证是否有任何首选方法

• myForm.controls['name'].valid
• myForm.get('name').valid

因为两者似乎只是在语法上不同,但实现了相同的目标.

<label>Name
  <input type="text" formControlName="name">
</label>
<div class="alert" *ngIf="!myForm.controls['name'].valid && myForm.controls['name'].touched">
  {{ titleAlert }}
</div>

与...一样

<div class="alert" *ngIf="!myForm.get('name').valid && myForm.get('name').touched">
  {{ titleAlert }}
</div>

从我在代码中检查,get有这个代码:

AbstractControl.prototype.get = function (path) { return _find(this, path, '.'); };

我刚刚开始使用Angular,所以我们将非常感谢专家意见.

我是角色的新手,我有以下情况,即我有一个服务getAnswers():Observable<AnswerBase<any>[]>和两个相互关联的组件.

• 网上报价
• 动态形式

online-quote组件getAnswers():Observable<AnswerBase<any>[]>在其ngOnInit()方法中调用服务,并将其结果传递给组件dynamic-form.

为了说明这种情况,这是我的两个组件的代码:

在线quote.component.html:

 <div>
    <app-dynamic-form [answers]="(answers$ | async)"></app-dynamic-form>
</div>

在线quote.component.ts:

@Component({
  selector: 'app-online-quote',
  templateUrl: './online-quote.component.html',
  styleUrls: ['./online-quote.component.css'],
  providers:  [DynamicFormService]
})
export class OnlineQuoteComponent implements OnInit {

  public answers$: Observable<any[]>;

  constructor(private service: DynamicFormService) {

   }

  ngOnInit() {
    this.answers$=this.service.getAnswers("CAR00PR");
  }

}

动态form.component.html:

<div *ngFor="let answer of answers">
 <app-question *ngIf="actualPage===1" [answer]="answer"></app-question>
</div>

动态form.component.ts:

@Component({
  selector: 'app-dynamic-form',
  templateUrl: './dynamic-form.component.html',
  styleUrls: ['./dynamic-form.component.css'],
  providers: [ AnswerControlService ]
})
export class DynamicFormComponent implements OnInit { …

我们正在开始一个新的Angular 2项目,并正在考虑是否使用Reactive Forms或Template Forms.背景阅读:https://angular.io/guide/reactive-forms

据我所知,Reactive Forms的最大优势在于它们是同步的,但我们有简单的形式,我不认为异步会导致我们的问题.Reactive似乎有更多的开销,表面上有更多代码可以做同样的事情.

有人可以提供一个可靠的用例,我会使用Reactive而不是更简单的模板表单吗？

我在数据表上使用Angular插件.数据表的容器是可调整大小的,而通过doc,我知道当有窗口调整大小事件时,它自己将调整大小的数据表.在jQuery我知道有一个,$(window).trigger()但我不知道如何做角度.

我的问题是:在父角度指令中,如何触发窗口调整大小事件？