现在能够在两个组件之间进行通信。但不知道如何通过事件发射器从 MatDialog 组件将用户(选定)输入的值作为对象传递给父组件。在这里,我想在单击提交按钮后将选定的选项值和文本区域值作为对象传递。
对话框.html
<mat-select [(ngModel)]="selectedIssue" [ngModelOptions]="{standalone: true}">
<mat-option [value]="option1">Option AA</mat-option>
<mat-option [value]="option2">Option BB</mat-option>
<mat-option [value]="option3">Option CC</mat-option>
<mat-option [value]="option4">Option DD</mat-option>
<mat-option [value]="option5">Option EE</mat-option>
</mat-select>
<div>
<textarea class="mention-reason" [(ngModel)]="reason" [ngModelOptions]="{standalone: true}"></textarea>
</div>
<button class="cancel" matDialogClose>Cancel</button>
<button class="submit" [mat-dialog-close] (click)="submitUserReason()">Submit</button></span>
Run Code Online (Sandbox Code Playgroud)
对话框.ts
onSubmitReason = new EventEmitter();
submitUserReason(): void {
this.onSubmitReason.emit('hello');
}
onConfirmClick(): void {
this.dialogRef.close(true);
}
Run Code Online (Sandbox Code Playgroud)
父母.ts
callSupport() {
const dialogRef = this.dialog.open(customerSupportComponent);
const subscribeDialog = dialogRef.componentInstance.onSubmitReason.subscribe((data) => {
console.log('dialog data', data);
//i can see 'hello' from MatDialog
});
dialogRef.afterClosed().subscribe(result => {
subscribeDialog.unsubscribe(); …Run Code Online (Sandbox Code Playgroud) 我试图将正常的bootstrap模板转换为angular网站.我面临的问题,而路由从一个页面导航到另一个喜欢About到Contact反之亦然.
该模板已经具有以下格式,使用一些css进行平滑滚动hashtag #.
我的app.compo.html
之前: <li><a href="#header">About</a></li>
之后: <li><a routerLink="/about" routerLinkActive="active" href="#header">About</a></li>
<a href="#header" id="btp" class="back-to-top btn-floating waves-effect waves-light btn-large custom-btn">
<i class="ion-ios-arrow-up"></i>
</a>
Run Code Online (Sandbox Code Playgroud)
app.routing.ts
const routes: Routes = [
{ path: '', redirectTo: 'about', pathMatch: 'full' },
{ path: 'about', component: about, data: { state: 'about'} },
{ path: 'contact', component: contact, data: { state: 'contact'} },
];
export const AppRouting = RouterModule.forRoot(routes, {
useHash: true
});
Run Code Online (Sandbox Code Playgroud)
在我点击npm start之后,它在我的控制台中显示如下
** NG …Run Code Online (Sandbox Code Playgroud) 尝试创建用于学习目的的自定义指令。我无法确定为什么 Angular 6 中的 renderer2 不显示图像背景的问题。
我使用的是 cli,因此在 app.module.ts 中注册指令没有问题
@Directive({
selector: '[bgIMG]'
})
export class MyCustomStyleDirective {
// private url = "http://www.publicdomainpictures.net/pictures/50000/velka/flower-meadow.jpg"
constructor(elm : ElementRef, renderer2:Renderer2) {
renderer2.setStyle(elm.nativeElement, 'background-image', 'url ("http://www.publicdomainpictures.net/pictures/50000/velka/flower-meadow.jpg")')
}
}
Run Code Online (Sandbox Code Playgroud)
<div bgIMG></div>
Run Code Online (Sandbox Code Playgroud)
哪里错了.? 我也没有发现任何控制台错误。
import { Directive,ElementRef, Renderer2, HostListener } from '@angular/core';
@Directive({
selector: '[bgIMG]'
})
export class MyCustomStyleDirective {
constructor( renderer: Renderer2, el: ElementRef) {
renderer.setStyle(el.nativeElement, 'background-image','http://www.publicdomainpictures.net/pictures/50000/velka/flower-meadow.jpg');
renderer.setStyle(el.nativeElement, 'font-weight','bold');
}
}
html
-----
<div class="container">
<div class="row">
<div bgIMG>
<p>some text</p>
</div>
</div> …Run Code Online (Sandbox Code Playgroud) 这可能是重复问题但不能理解如何配置FE和BE一起运行它们.
我的Node + Express在4300上运行
app.post('/postData', function(req, res) {
//some worst logics here :)
});
Run Code Online (Sandbox Code Playgroud)
和
角度5运行在4200.下面是我的FE服务,呼叫后端点
postData(feData) {
console.log(feData);
this.http.post('/postData', feData, this.httpHeader).subscribe((data) => {
});
}
Run Code Online (Sandbox Code Playgroud)
我尝试的是打开2厘米提示.一个用节点server.js运行server.js,另一个用ng服务运行.
结果===> 404不是fount(不能发帖)
哪里做错了.请指出我正确的方向.在此之后我只想在github.io上托管它
提前致谢.
有人可以告诉如何以角度实现以下格式吗?
预期的:
20JAN2019
现在使用角度默认管道。我越来越喜欢
20/01/2019 使用 {{slotEndDate | 日期:'dd/MM/yyyy'}}
我需要编写自定义管道来获得所需的输出吗?
请分享一些示例或演示 stackblitz。
谢谢
angular ×5
javascript ×3
typescript ×3
angular5 ×1
angular6 ×1
date-pipe ×1
datetime ×1
eventemitter ×1
express ×1
html ×1
node.js ×1