有 2 个组件 A 和 B,以及一个具有“获取数据”和“更新数据”两个功能的服务在数据库中。两个组件都使用数据模型,服务注册在公共模块中。更新数据库中的数据后如何在两个组件中获取更新的模型。? 那些。如何强制完成接收数据的功能?
Ara Chinaryan
Asked:
2020-08-23 17:11:28 +0800 CST
我有条件在id="confirm_Password"
创建或删除span
包含内容的元素后,但这是使用完成的Jquery
,您可以帮助将其转换为干净的typescript
if (data['password'] == data['confirm_Password']) {
$('.confirm_Password_message').remove();
} else {
$('<span class="confirm_Password_message">Passwords do not match</span>').insertAfter($('#confirm_Password'));
}
形式
config: FieldConfig[] = [
{
type: 'textarea',
label: 'Description',
name: 'description',
placeholder: 'Description',
value: '',
validation: [
{
name: 'required',
validator: Validators.required,
message: 'Description Required'
}
]
},
{
type: 'checkbox',
label: 'Status',
name: 'status',
value: ''
},
{
label: 'Submit',
name: 'submit',
type: 'button',
}
];
表单html
<div class="modal-body">
<app-dynamic-form #form="appDynamicForm" (submit)="formSubmitted($event)" [config]="config"></app-dynamic-form>
<button type="button" class="btn btn-default float-right mr-2" (click)="hideModal()">Close</button>
</div>
Данис Хамидуллин
Asked:
2020-08-17 22:00:26 +0800 CST
一页上有几个routerLink
,导致notes/:id
:
routerLink="notes/1"
routerLink="notes/2"
routerLink="notes/3"
...
在同一个父组件中,该组件被<router-outlet></router-outlet>
加载NoteView
,它id
查找并显示信息。在地址栏中的链接之间切换时id
,组件会更改但不会重新加载,会与第一个id
打开的链接挂起。每次单击不同的链接时,如何强制组件更新?Event
在每次点击链接的时候,EventListner
会不会太麻烦的解决方案,会有几个这样的组件。
路线是这样的:
const routes: Routes = [
{
path: '',
component: HomeComponent
},
{
path: 'app',
component: TodoAppParentComponent,
children: [{
path: 'notes',
children: [{
path: ':id', // id в ссылке меняется но компонент остается неизменным
component: NoteViewComponent
}]
}]
}
];
问题组件类
export class NoteViewComponent implements OnInit {
id: string = null;
note: object = null;
constructor(
private http: HttpService,
private activatedRoute: ActivatedRoute
) { }
ngOnInit() {
this.id = this.activatedRoute.snapshot.params['id']; // не срабатывает при переходе по разным routerLink, как сделать чтоб срабатывал?
this.note = {
title: 'Пример заголовка, заметка',
body: `lorem....`
};
}
}
HTML 组件模板
<p>
id: {{id}}
</p>
<div *ngIf="note">
<h3>{{note.title}}</h3>
<hr>
<div class="body" innerHTML="{{note.body}}"></div>
</div>
Kris_tina
Asked:
2020-08-13 17:08:29 +0800 CST
使用 Angular Material 5.2.4(客户端的选择列表组件)从客户端向服务器发送数据时出现问题。事实上,一个带有名称和 id 的复选框列表。因此,我无法将检查的 id 值数组发送到服务器,因为 浏览器仅对检查 MatListOption 做出反应,而由 id 组成的值本身,我无法从中获取。
这是component.html程序代码
<mat-selection-list
(selectionChange)="onSelection($event.source.selectedOptions.selected)" >
<mat-list-option *ngFor="let car of cars" [value]="car.id"
checkboxPosition="before" >
{{car.description}}
</mat-list-option>
</mat-selection-list>
组件.ts
import { Component, OnInit } from '@angular/core';
import { ListService } from '../list.service';
@Component({
selector: 'app-list-measu',
templateUrl: './list-measu.component.html',
styleUrls: ['./list-measu.component.css']
})
export class ListMeasuComponent implements OnInit {
cars: Array<any>;
current_selected: string;
id: Array<any> = new Array<any>();
constructor(private listService: ListService) { }
ngOnInit() {
this.listService.getAllmeasures().subscribe(data => {
this.cars = data;
});
}
onSelection(e){
console.log(e);
});
谢谢您的帮助!)
Aleksey exec
Asked:
2020-07-24 23:37:37 +0800 CST
items数组中有 10 个对象,我只需要使用 size 变量显示前 4 个对象
app.component.html
<div class="prod-section">
<div *ngFor="let item of items">
<h1>{{ item.id }}</h1>
<p>{{ item.name }}</p>
</div>
</div>
app.component.ts
size: number = 4;
items = [
{ id: 1, name: 'плитка' },
{ id: 2, name: 'плитка' },
{ id: 3, name: 'плитка' },
{ id: 4, name: 'плитка' },
{ id: 5, name: 'плитка' },
{ id: 6, name: 'плитка' },
{ id: 7, name: 'плитка' },
{ id: 8, name: 'плитка' },
{ id: 9, name: 'плитка' },
{ id: 10, name: 'плитка' },
];