Questions tagged «angular»

我试图在Angular 2中实现动态表单。我向动态表单添加了其他功能，例如删除和取消。我已遵循此文档：https : //angular.io/docs/ts/latest/cookbook/dynamic-form.html 我对代码进行了一些更改。我在这里出错。 我如何使此错误消失？ 您可以在此处找到完整的代码：http : //plnkr.co/edit/SL949g1hQQrnRUr1XXqt?p=preview，它可以在插件中使用，但不能在我的本地系统中使用。 HTML代码： <div> <form [formGroup]="form"> <div *ngFor="let question of questions" class="form-row"> <label [attr.for]="question.key">{{question.label}}</label> <div [ngSwitch]="question.controlType"> <input *ngSwitchCase="'textbox'" [formControlName]="question.key" [id]="question.key" [type]="question.type" [(ngModel)]="question.value"> <select [id]="question.key" [(ngModel)]="question.value" *ngSwitchCase="'dropdown'" [formControlName]="question.key" > <option *ngFor="let opt of question.options" [ngValue]="opt.key" >{{opt.value}}</option> </select> <input *ngSwitchCase="'checkbox'" [(ngModel)]="question.value" [id]="question.key" [type]="question.type" (change)="question.value = …

178 forms  angular  angular2-template  angular2-forms 

除了手动编辑所有组件文件（例如文件夹名称，.css，.ts，spec.ts和app.module.ts）之外，是否有使用Angular CLI重命名组件的快捷方式？

178 angular  angular-cli  rename  angular-components 

我在该组件中有一个Angular2组件，它目前有一堆字段，在它们之前应用了@Input（）以允许绑定到该属性，即 @Input() allowDay: boolean; 我想做的实际上是使用get / set绑定到属性，以便可以在setter中执行其他一些逻辑，如下所示 _allowDay: boolean; get allowDay(): boolean { return this._allowDay; } set allowDay(value: boolean) { this._allowDay = value; this.updatePeriodTypes(); } 我将如何在Angular2中做到这一点？ 基于Thierry Templier的建议，我将其更改为，但这引发错误无法绑定到“ allowDay”，因为它不是已知的本机属性： //@Input() allowDay: boolean; _allowDay: boolean; get allowDay(): boolean { return this._allowDay; } @Input('allowDay') set allowDay(value: boolean) { this._allowDay = value; this.updatePeriodTypes(); …

178 angular 

安装角之后，打字稿编译器的愈来愈约没有找到一些错误Promise，Map，Set和Iterator。 直到现在我都忽略了它们，但是现在我需要Promise使我的代码可以工作。 import {Component} from 'angular2/core'; @Component({ selector: 'greeting-cmp', template: `<div>{{ asyncGreeting | async}}</div>` }) export class GreetingCmp { asyncGreeting: Promise<string> = new Promise(resolve => { // after 1 second, the promise will resolve window.setTimeout(() => resolve('hello'), 1000); }); } Additional information: npm -v is 2.14.12 node -v is v4.3.1 …

177 javascript  angular  typescript 

这真让我发疯，我不知所措，不能再为此花整整一天的时间。 我正在尝试在组件内手动设置一个控制值（'dept'），但它不起作用-甚至新值也无法正常记录。 这是FormBuilder实例： initForm() { this.form = this.fb.group({ 'name': ['', Validators.required], 'dept': ['', Validators.required], 'description': ['', Validators.required], }); } 这是接收选定的部门的事件处理程序： deptSelected(selected: { id: string; text: string }) { console.log(selected) // Shows proper selection! // This is how I am trying to set the value this.form.controls['dept'].value = selected.id; } 现在，提交表单并注销后，this.form该字段仍为空白！我看过其他ppl的用法，updateValue()但这是beta.1，但我不认为这是调用控件的有效方法。 我也曾尝试致电updateValueAndValidity()失败，:(。 …

175 forms  components  angular 

我在Angular 2中隐藏和显示依赖于布尔变量的元素时遇到问题。 这是div显示和隐藏的代码： <div *ngIf="edited==true" class="alert alert-success alert-dismissible fade in" role="alert"> <strong>List Saved!</strong> Your changes has been saved. </div> 变量被“编辑”，并存储在我的组件中： export class AppComponent implements OnInit{ (...) public edited = false; (...) saveTodos(): void { //show box msg this.edited = true; //wait 3 Seconds and hide setTimeout(function() { this.edited = false; …

174 typescript  angular 

ChangeDetectorRef.markForCheck()和之间有什么区别ChangeDetectorRef.detectChanges()？ 我只找到了关于SO的信息NgZone.run()，但没有找到这两个功能之间的区别。 对于仅参考文档的答案，请举例说明一些实际情况，以供选择。

174 angular  angular2-changedetection 

我知道这是一个非常普遍的问题，但是我无法在Angular 2中上传文件。 1）http://valor-software.com/ng2-file-upload/和 2）http://ng2-uploader.com/home ...但是失败了。有没有人在Angular中上传文件？您使用什么方法？怎么做？如果提供任何示例代码或演示链接，将不胜感激。

173 angular  file-upload  angular2-http 

在Angular 2中将用户重定向到完全外部URL的方法是什么。例如，如果需要将用户重定向到OAuth2服务器以进行身份​​验证，我该怎么做？ Location.go()，，Router.navigate()和Router.navigateByUrl()可以将用户发送到Angular 2应用程序内的另一个区域（路线），但是我看不到如何将其用于重定向到外部站点？

173 redirect  angular  angular2-routing 

我正在启动我的第一个Angular应用程序，并且我的基本设置已经完成。 如何将Bootstrap添加到我的应用程序？ 如果您可以提供示例，那将是一个很大的帮助。

170 angular  twitter-bootstrap  typescript  twitter-bootstrap-3 

现在，我有一个初始页面，其中有三个链接。一旦单击最后一个“朋友”链接，就会启动适当的朋友组件。在这里，我想获取/获取存放在friends.json文件中的朋友列表。到现在为止一切正常。但是，我仍然是使用RxJs的可观察，映射，订阅概念的angular2 HTTP服务的新手。我试图理解它并读了几篇文章，但是直到我投入实际工作之前，我不会正确地理解那些概念。 在这里，我已经制作了plnkr，除了HTTP相关的工作外，该工作都在工作。 普伦克 myfriends.ts import {Component,View,CORE_DIRECTIVES} from 'angular2/core'; import {Http, Response,HTTP_PROVIDERS} from 'angular2/http'; import 'rxjs/Rx'; @Component({ template: ` <h1>My Friends</h1> <ul> <li *ngFor="#frnd of result"> {{frnd.name}} is {{frnd.age}} years old. </li> </ul> `, directive:[CORE_DIRECTIVES] }) export class FriendsList{ result:Array<Object>; constructor(http: Http) { console.log("Friends are being called"); // below code …

170 http  angular  rxjs 

我从HTTP调用中获取了很多HTML代码。我将HTML块放入变量中，并使用[innerHTML]将其插入到我的页面中，但是我无法为插入的HTML块设置样式。有人对我如何实现这一目标有任何建议吗？ @Component({selector: 'calendar', template: '<div [innerHTML]="calendar"></div>', providers:[HomeService], styles: [` h3 {color:red;} `}) 我要设置样式的HTML是变量“ calendar”中包含的块。

170 angular  innerhtml 

我开始使用angular-cli，并且我已经读了很多书，找到了关于我想做什么的答案...没有成功，所以我来到了这里。 有没有办法为新模块创建组件？ 例如： ng g module newModule ng g component newComponent （如何将此组件添加到newModule？） 因为angular-cli的默认行为是将所有新组件放入app.module。我想选择组件的位置，以便可以创建单独的模块，而不会在其中包含所有组件app.module。可以使用angular-cli来做到这一点，还是必须手动执行此操作？

170 angular  typescript  angular-cli 

我正在尝试将Angular 5.2应用程序更新为Angular6。我已成功按照Angular更新指南（包括angular-cli对v6 的更新）中的说明进行操作，现在我正尝试通过以下方式为该应用程序提供服务 ng serve --env=local 但这给了我错误： 未知选项：“-env” 我使用了多个环境（dev/local/prod），这就是它在Angular 5.2中的工作方式。我现在如何在Angular 6中设置环境？

169 angular  angular6  angular-cli 

我的组件的样式取决于当前日期时间。在我的组件中，我具有以下功能。 private fontColor( dto : Dto ) : string { // date d'exécution du dto let dtoDate : Date = new Date( dto.LastExecution ); (...) let color = "hsl( " + hue + ", 80%, " + (maxLigness - lightnessAmp) + "%)"; return color; } lightnessAmp从当前日期时间计算得出。如果dtoDate最近24小时内，颜色会发生变化。 确切的错误如下： 检查后表达式已更改。先前值：“ hsl（123，80％，49％）”。当前值：“ hsl（123，80％，48％）” …

167 angular  typescript  time  styles  components