Questions tagged «angular»

有关Angular(不要与AngularJS混淆)的问题,它是Google的网络框架。将此标签用于并非特定于单个版本的角度问题。对于较旧的AngularJS(1.x)Web框架,请使用angularjs标记。

2
Angular组件中的“私有”和“公共”
如果我没有在,和之前添加private,则我认为它们默认是公开的。fooloadBartext export class RandomComponent { @Input() foo: string; @Output() loadBar = new EventEmitter(); text: string; } 当它们public在组件中时,是否有任何用例? 出于封装/安全性的原因,我是否应该总是private像下面这样为它们全部添加? export class RandomComponent { @Input() private foo: string; @Output() private loadBar = new EventEmitter(); private text: string; } 谢谢

23
Angular + Material-如何刷新数据源(mat-table)
我正在使用一张桌子来列出用户选择的语言的内容。他们还可以使用对话框面板添加新语言。之后,他们添加了一种语言并返回。我希望刷新数据源以显示所做的更改。 我通过从服务获取用户数据并将其传递到refresh方法中的数据源中来初始化数据存储。 Language.component.ts import { Component, OnInit } from '@angular/core'; import { LanguageModel, LANGUAGE_DATA } from '../../../../models/language.model'; import { LanguageAddComponent } from './language-add/language-add.component'; import { AuthService } from '../../../../services/auth.service'; import { LanguageDataSource } from './language-data-source'; import { LevelbarComponent } from '../../../../directives/levelbar/levelbar.component'; import { DataSource } from '@angular/cdk/collections'; import { Observable …

13
如何结束服务或火力基地服务
我一直在使用Angular2进行Web开发,并一直使用Angular2和Firebase来运行本地服务器。使用Ionic创建服务器时,我找不到类似于键入quit的命令,因此每次都必须关闭终端选项卡。有没有一种方法可以结束服务器并恢复我的终端机标签? 谢谢。

11
从角度2中的存储数组中删除项目
我想使用Type Script从角度2的存储数组中删除一个项目。我正在使用一种称为数据服务的服务,即数据服务代码: export class DataService { private data: string[] = []; addData(msg: string) { this.data.push(msg); } getData() { return this.data; } deleteMsg(msg: string) { delete [this.data.indexOf(msg)]; } } 而我的组件类: import {Component} from '@angular/core' import {LogService} from './log.service' import {DataService} from './data.service' @Component({ selector: 'tests', template: ` <div class="container"> <h2>Testing Component</h2> …


11
Angular 2同级组件通信
我有一个ListComponent。在ListComponent中单击某个项目时,该项目的详细信息应显示在DetailComponent中。两者同时显示在屏幕上,因此不涉及路由。 如何告诉DetailComponent单击ListComponent中的哪个项目? 我考虑过向父对象(AppComponent)发出事件,并让父对象使用@Input在DetailComponent上设置selectedItem.id。或者,我可以将共享服务与可观察的订阅一起使用。 编辑:通过事件+ @Input设置所选项目不会触发DetailComponent,但是,以防万一我需要执行其他代码。因此,我不确定这是否可以接受。 但是,这两种方法似乎都比通过Angular 1做事的方式复杂得多,后者是通过$ rootScope。$ broadcast或$ scope。$ parent。$ broadcast实现的。 由于Angular 2中的所有内容都是组件,我很惊讶没有更多有关组件通信的信息。 是否有另一种/更直接的方法来完成此任务?

9
在Angular 4中检测实时窗口大小变化
我一直在尝试构建一个响应式导航栏,并且不希望使用媒体查询,因此我打算使用*ngIF窗口大小作为标准。但是我遇到了一个问题,因为我无法找到有关Angular 4窗口大小检测的任何方法或文档。我也尝试过JavaScript方法,但不支持。 我也尝试了以下方法: constructor(platform: Platform) { platform.ready().then((readySource) => { console.log('Width: ' + platform.width()); console.log('Height: ' + platform.height()); }); } ...用于离子 并且screen.availHeight,但仍然没有成功。
118 html  angular  dom-events 

15
Angular2验证器,它依赖于多个表单字段
是否可以创建一个可以使用多个值来确定我的字段是否有效的验证器? 例如,如果客户首选的联系方式是通过电子邮件,则必须填写电子邮件字段。 谢谢。 更新了示例代码... import {Component, View} from 'angular2/angular2'; import {FormBuilder, Validators, formDirectives, ControlGroup} from 'angular2/forms'; @Component({ selector: 'customer-basic', viewInjector: [FormBuilder] }) @View({ templateUrl: 'app/components/customerBasic/customerBasic.html', directives: [formDirectives] }) export class CustomerBasic { customerForm: ControlGroup; constructor(builder: FormBuilder) { this.customerForm = builder.group({ firstname: [''], lastname: [''], validateZip: ['yes'], zipcode: ['', this.zipCodeValidator] // …
118 angular 

16
组件是2个模块声明的一部分
我尝试构建一个ionic 2应用程序。当我在使用离子服务的浏览器中尝试该应用程序或在模拟器上启动该应用程序时,一切正常。 但是当我每次尝试构建它时都会出错 ionic-app-script tast: "build" Error Type AddEvent in "PATH"/add.event.ts is part of the declarations of 2 modules: AppModule in "PATH"/app.modules.ts and AddEvent in "PATH"/add-event.module.ts. Please consider moving AddEvent in "PATH"/add-event.ts to a higher module that imports AppModule in "PATH"/app.module.ts and AddEventModule. You can also creat a new NgModule …

5
使用angular 2的HTML5事件处理(onfocus和onfocusout)
我有一个日期字段,并且我想默认删除占位符。 我正在使用JavaScript onfocus和onfocusout事件删除占位符。 有人可以帮助使用angular2指令吗? <input name="date" type="text" onfocus="(this.type='date')" onfocusout="(this.type='text')" class="dateinput"> 我尝试以这种方式解决,但是在重置输入字段类型时遇到问题。 import { Directive, ElementRef, Input } from 'angular2/core'; @Directive({ selector: '.dateinput', host: { '(focus)': 'setInputFocus()', '(focusout)': 'setInputFocusOut()', }}) export class MyDirective { constructor(el: ElementRef) { this.el = el.nativeElement; console.log(this.el);} setInputFocus(): void { //console.log(this.elementRef.nativeElement.value); } }
117 angular 

11
RouterLink不起作用
我在angular2应用中的路由运行良好。但是我将基于此进行一些routeLink : 这是我的路线: const routes: RouterConfig = [ { path:'home' , component: FormComponent }, { path:'about', component: AboutComponent }, { path:'**' , component: FormComponent } ]; 这是我制作的链接: <ul class="nav navbar-nav item"> <li> <a routerLink='/home' routerLinkActive="active">Home</a> </li> <li> <a routerLink='/about' routerLinkActive="active">About this</a> </li> </ul> 我希望,当我单击它们时,它会导航到受尊重的组件,但是它们不执行任何操作?

6
TypeScript中的EventTarget类型不存在属性“值”
因此,以下代码位于Angular 4中,我无法弄清楚为什么它无法按预期方式工作。 这是我的处理程序的片段: onUpdatingServerName(event: Event) { console.log(event); this.newserverName = event.target.value; //this wont work } HTML元素: <input type="text" class="form-control" (input)="onUpdatingServerName($event)"> 该代码给我错误: 类型“ EventTarget”上不存在属性“值”。 但从中可以看出,该console.log值确实存在event.target。

16
以反应形式禁用输入字段
我已经尝试遵循此处其他答案的示例,但未成功! 我创建了一个响应式表单(即动态表单),并且想在任何给定时间禁用某些字段。我的表格代码: this.form = this._fb.group({ name: ['', Validators.required], options: this._fb.array([]) }); const control = <FormArray>this.form.controls['options']; control.push(this._fb.group({ value: [''] })); 我的html: <div class='row' formArrayName="options"> <div *ngFor="let opt of form.controls.options.controls; let i=index"> <div [formGroupName]="i"> <select formArrayName="value"> <option></option> <option>{{ opt.controls.value }}</option> </select> </div> </div> </div> 我减少了代码以方便使用。我想禁用类型选择的字段。我尝试执行以下操作: form = new FormGroup({ first: new FormControl({value: …
117 angular 


21
Angular 2下拉选项默认值
在Angular 1中,我可以使用以下命令为下拉框选择默认选项: <select data-ng-model="carSelection" data-ng-options = "x.make for x in cars" data-ng-selected="$first"> </select> 在Angular 2中,我有: <select class="form-control" [(ngModel)]="selectedWorkout" (ngModelChange)="updateWorkout($event)"> <option *ngFor="#workout of workouts">{{workout.name}}</option> </select> 给定我的选项数据,我该如何选择默认选项: [{name: 'arm'}, {name: 'back'}, {name:'leg'}]我的默认值是back多少?
115 html  angular 

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.