程序设计 angular

4

我目前正在关注一个教程，并且该教程正在使用EventEmitter。代码像这样 @Output() ratingClicked: EventEmitter<string> = new EventEmitter<string>(); 但是Visual Studio代码给了我这些错误：类型“ EventEmitter”不是通用的。期望0类型参数，但得到1。即使在有角度的网站中，看起来该代码也是正确的。我目前正在使用Angular CLI：1.7.4; 节点：8.11.1; 打字稿：2.8.1

79 angular typescript

4

Angular2 Router错误：找不到主插座以加载“ HomePage”

我刚刚开始使用新的路由库（@ angular / router v3.0.0-alpha.7），但是遵循官方文档会导致以下错误： browser_adapter.ts:74: EXCEPTION: Error: Uncaught (in promise): Error: Cannot find primary outlet to load 'HomePage' 问题是-如何摆脱错误并使路由器表现出预期的效果？我错过了设置吗？（使用alpha.6版本时，会出现相同的错误。） app.component.ts import { Component } from '@angular/core'; import { ROUTER_DIRECTIVES } from '@angular/router'; @Component({ selector: 'app', template: ` <p>Angular 2 is running...</p>  <router-outlet></router-outlet> …

79 angular router

6

Angular2-“路由器出口”不是已知元素

我创建了具有较深子路径的路径。我添加<router-outlet>了包裹在NgModule中的AdminComponent组件。但是刷新页面后出现此错误： 'router-outlet' is not a known element 可能是因为我忘记将某些模块导入admin.module.ts 请帮忙。谢谢。 app.routes.ts export const routes: Routes = [ { path: '', component: AppComponent, children: [ { path: '', component: LoginComponent }, { path: 'admin', component: AdminComponent }, { path: 'user', component: UserComponent }, { path: 'there', component: ThereComponent } ] } ] …

79 angular angular2-routing

13

Angular 2：从父组件获取RouteParams

如何从父组件获取RouteParams？ App.ts： @Component({ ... }) @RouteConfig([ {path: '/', component: HomeComponent, as: 'Home'}, {path: '/:username/...', component: ParentComponent, as: 'Parent'} ]) export class HomeComponent { ... } 然后，在中ParentComponent，我可以轻松获取用户名参数并设置子路由。 Parent.ts： @Component({ ... }) @RouteConfig([ { path: '/child-1', component: ChildOneComponent, as: 'ChildOne' }, { path: '/child-2', component: ChildTwoComponent, as: 'ChildTwo' } ]) export class …

79 angular angular2-routing

2

Angular中的视图提供者是什么？黑白提供者与视图提供者有什么区别？

以下代码中的viewProviders是什么？它与提供者有何不同？ class Greeter { greet(name:string) { return 'Hello ' + name + '!'; } } @Component({ selector: 'greet', viewProviders: [ Greeter ], template: `<needs-greeter></needs-greeter>` }) class HelloWorld { }

79 angular

14

Angular 5 FormGroup重置不会重置验证器

我的页面上有一个表单，当我调用FormGroup.reset()它时，将forms类设置为，ng-pristine ng-untouched但FormControl.hasError(...)仍然返回true。我在这里做错了什么？模板 <form [formGroup]="myForm" (ngSubmit)="submitForm(myForm)"> <mat-form-field> <input matInput formControlName="email" /> <mat-error *ngIf="email.hasError('required')"> Email is a required feild </mat-error> </mat-form-field> <mat-form-field> <input matInput type="password" formControlName="password" /> <mat-error *ngIf="password.hasError('required')"> Password is a required feild </mat-error> </mat-form-field> <button type="submit">Login</button> </form> 零件 export class MyComponent { private myForm: FormGroup; private email: FormControl = …

79 html angular typescript angular-material angular-reactive-forms

10

使用Visual Studio Code调试并运行Angular2 Typescript？

使用Visual Studio Code调试并运行Angular2 Typescript？我正在尝试使用VS代码https://angular.io/guide/quickstart调试Angular2打字稿应用程序任何人都可以分享从VS代码进行调试和运行的步骤吗？

79 angular typescript visual-studio-code

4

在Angular 2中使用D3.js

我已经成功将Angular 2（Alpha 44）与D3.js集成在一起： <html> <head> <title>Angular 2 QuickStart</title> <script src="../node_modules/systemjs/dist/system.src.js"></script> <script src="../node_modules/angular2/bundles/angular2.dev.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js" charset="utf-8"></script> <script> System.config({packages: {'app': {defaultExtension: 'js'}}}); System.import('app/app'); </script> </head> <body> <my-app>Loading...</my-app> </body> </html> app.js： /// <reference path="./../../typings/tsd.d.ts" /> import {Component, bootstrap, ElementRef} from 'angular2/angular2'; @Component({ selector: 'my-app', template: '<h1>D3.js Integrated if background is yellow</h1>', providers: [ElementRef] …

78 angular d3.js

5

专注于新添加的输入元素

我有一个带有input框列表的新Angular 2应用程序。当用户按下回车键时，我会input在他们当前正在编辑的框之后立即添加一个新框。或者，我（异步）向模型中的数组添加一个新条目，这导致Angular 2input在不久的将来自动生成一个新盒子。如何使input焦点自动更改为新添加的元素？编辑1：或者，我得到对导致DOM生成的模型对象的引用。从组件代码中，有没有一种方法可以搜索表示特定模型对象的DOM元素？编辑2：这是我的代码，以使这项工作。希望这对某些Angular 2开发人员来说足够令人反感，以鼓励他们回复:-) app.WordComponent = ng.core .Component({ selector: 'word-editor', template:'<input type="text" [value]="word.word" (input)="word.update($event.target.value)" (keydown)="keydown($event)"/>', styles:[ '' ], properties:[ 'list:list', 'word:word' ] }) .Class({ constructor:[ function() { } ], keydown:function(e) { if(e.which == 13) { var ul = e.target.parentNode.parentNode.parentNode; var childCount = ul.childNodes.length; this.list.addWord("").then(function(word) { …

78 angular

10

Angular2-将文本框放在组件加载上

我正在开发Angular2（测试版8）中的组件。该组件具有一个文本框和一个下拉列表。我想在组件加载后或下拉菜单发生更改事件时立即在文本框中设置焦点。我将如何在angular2中实现这一目标。以下是该组件的HTML。 <div> <form role="form" class="form-horizontal "> <div [ngClass]="{showElement:IsEditMode, hidden:!IsEditMode}"> <div class="form-group"> <label class="control-label col-md-1 col-sm-1" for="name">Name</label> <div class="col-md-7 col-sm-7"> <input id="name" type="text" [(ngModel)]="person.Name" class="form-control" /> </div> <div class="col-md-2 col-sm-2"> <input type="button" value="Add" (click)="AddPerson()" class="btn btn-primary" /> </div> </div> </div> <div [ngClass]="{showElement:!IsEditMode, hidden:IsEditMode}"> <div class="form-group"> <label class="control-label col-md-1 col-sm-1" for="name">Person</label> <div …

78 angular angular2-template angular2-forms

3

为什么colspan在Angular 2中不是已知的本机属性？

如果我们尝试这样的代码： <td [colspan]="1 + 1">Column</td> 或这个： <td colspan="{{1 + 1}}">Column</td> 我们很快就会发现“colspan不是已知的本机属性”。从A2文档中我们了解到：元素没有colspan属性。它具有“ colspan”属性，但是插值和属性绑定只能设置属性，不能设置属性。相反，我们必须这样做： <td [attr.colspan]="1 + 1">Column</td> 这很公平。题：我的问题是，为什么colspan不是DOM的属性，如果缺少属性，浏览器如何呈现表，因为浏览器呈现DOM而不是HTML？另外，如果我打开Chrome检查器，然后转到“属性”标签，为什么可以将colspan视为Element的属性？为什么DOM表现出这种不一致？

78 javascript angular dom

5

如何在角度2中绑定HTML中组件的静态变量？

我想在HTML页面中使用组件的静态变量。如何在angular 2中将组件的静态变量与HTML元素绑定？ import { Component, OnInit } from '@angular/core'; import { Observable } from 'rxjs/Rx'; @Component({ moduleId: module.id, selector: 'url', templateUrl: 'url.component.html', styleUrls: ['url.component.css'] }) export class UrlComponent { static urlArray; constructor() { UrlComponent.urlArray=" Inside Contructor" } } <div> url works! {{urlArray}} </div >

78 angular typescript angular2-services

9

Angular2路由器保留查询字符串

我编写了一个使用路由器的Angular2（v2.0.1）应用程序。该网站加载了几个查询字符串参数，因此完整的URL最初看起来像这样： https://my.application.com/?param1=val1&param2=val2&param3=val3 在我的路由配置中，我有一个条目可以重定向空路由： const appRoutes: Routes = [ { path: '', redirectTo: '/comp1', pathMatch: 'full' }, { path: 'comp1', component: FirstComponent }, { path: 'comp2', component: SecondComponent } ]; 我的问题是，启动应用程序后，URL不再包含查询参数，而是如下所示： https://my.application.com/comp1 有什么方法可以配置路由器，以便在导航时保留初始查询字符串？谢谢卢卡斯

78 angular angular2-routing

16

npm install->在node-sass@4.5.0后安装脚本处失败

我正在尝试做npm install，出现错误： Failed at the node-sass@4.5.0 postinstall script. 我试图删除node_modules然后重新安装它，出现同样的错误。解决办法是什么？节点v8.9.3 npm v5.4.2 ionic 3.19.0

78 angular reactjs npm ionic3 node-sass

15

角材料找不到角材料核心主题

在我的Angular2项目中，我从https://material.angular.io/guide/getting-started安装了最新的材质插件。接下来，将@import '~@angular/material/prebuilt-themes/deeppurple-amber.css';我的组件添加到我的css文件中。但是在我的控制台中，Angular显示了此错误： material.es5.js：148找不到Angular Material核心主题。大多数材料组件可能无法正常工作。欲了解更多信息请参阅主题化指南：https://material.angular.io/guide/theming ` 材料组件不起作用。怎么了？

78 angular themes

Questions tagged «angular»