使用反应形式我添加了ngbDatePicker:
<input type="text"
id="business_incorp_date"
class="form-control"
formControlName="business_incorp_date"
ngbDatepicker
#incorporatedDatePicker="ngbDatepicker"
(click)="incorporatedDatePicker.toggle()"
readonly>
对于以下形式的表单模型:
this.form = this.formBuilder.group({
id: [
0, [Validators.required]
],
// ... removed for brevity
business_type: [
'', [Validators.required]
],
business_incorp_date: [
'', [FormValidators.date] // <-- NOT REQUIRED BY MODEL
],
business_desc: [
'', [Validators.required]
]
// ...
});
但是,如果该字段为空,则对于以下内容仍然是ngInvalid ngbDateFormat:
{ "ngbDate": { "invalid": { "year": null, "month": null, "day": null } } }
任何人都知道如何使DatePicker字段允许空字符串？
我有一个(我认为是一个相当常见的)问题,我找不到使用当前Angular 4.x架构解决的好方法.也许有一种方法我还没有找到,但我已经进行了广泛的搜索.
我想将一些动态的,用户生成的HTML内容插入到Angular应用程序中.这个HTML内容我还包括一些已知的(包含在模块声明中)应该呈现的角度组件.下面是一些puesdo-app HTML可能会帮助我解释:
<app-component>
<!-- standard angular header and router-outlet -->
<app-header>
<app-nav>
<ul>
<li routerLink="/page-one">First Page</li>
<li routerLink="/page-two">Second Page</li>
<li routerLink="/page-three">Third Page</li>
</ul>
</app-nav>
</app-header>
<router-outlet></router-outlet>
<!--
the dynamic content would be inserted into the <main> element as HTML with angular <app-... tags
the content in the HTML content inserted main tag could contain anything
the angular components within the content should be initalized as normal
-->
<main>
<h1>Title</h1>
<app-component>
<p>this component and its content should be initalized …我有exf url的pdf文件的URL是"test.example.com/incoice/1/download?auth_token="some_token",当我访问此URL时,url将在浏览器中显示PDF.
现在我想用打印功能打开这个pdf,我的意思是用户不必按CTRL+P我想从我这边做这个.
我试过iframe,但它给了我错误的交叉起源.这是我使用的演示代码
//first try
let _printIframe;
var iframe = _printIframe;
if (!_printIframe) {
iframe = _printIframe = document.createElement('iframe');
document.body.appendChild(iframe);
iframe.style.display = 'none';
iframe.id = "printf";
iframe.name = "printf";
iframe.onload = function() {
setTimeout(function() {
iframe.focus();
iframe.contentWindow.print();
}, 1);
};
}
// second try
// SRC of pdf
iframe.src = "Some API URl " + "/download?access_token=" +
this.authenticationService.currentTokenDetails.access_token;
let url = iframe.src + "&output=embed";
window.frames["printf"].focus();
window.frames["printf"].print();
var newWin = window.frames["printf"];
newWin.document.write('<body onload="window.print()">dddd</body>');
newWin.document.close();
我在plunker中为print pdf创建了一个demo.http://embed.plnkr.co/WvaB9HZicxK6tC3OAUEw/在这个plunker我打开pdf在新窗口,但我想直接打印该pdf.我怎样才能做到这一点 …
我正在尝试使用来自firebase云功能的Mailgun的api发送电子邮件.我已经尝试在Cloud Function中实现了相同的nodejs教程,但我总是得到"错误:无法处理请求".请问我做错了什么.
云功能代码如下:
<pre>
<code>
var functions = require('firebase-functions');
var nodemailer = require('nodemailer');
var auth = {
auth: {
api_key: '###################',
domain: 's###############g'
}
}
exports.helloWorld = functions.https.onRequest((request, response) => {
response.send("Hello from Firebase!");
});
var nodemailerMailgun = nodemailer.createTransport(auth);
exports.sendEmail = functions.https.onRequest((request, response) =>{
//app.get('/', function(req, res) {
test();
});
function test(){
const mailOptions = {
//Specify email data
from: "info@xyz.com",
//The email to contact
to: "xyz@yahoo.com",
//Subject and text data
subject: 'Hello from Mailgun',
text: 'Hello, This is not …我的数据表中的样式粘贴标题有点问题.我编写了简单的Angular组件和特定的指令:
sticky.directive.ts
@Directive({
selector: '[sticky]'
})
export class StickyDirective {
constructor(private _element: ElementRef, private _window: WindowRef) {
console.log('debug')
}
@HostListener('window:scroll', ['$event'])
handleScrollEvent(e) {
if (this._window.nativeWindow.pageYOffset > 100) {
this._element.nativeElement.classList.add('stick');
} else {
this._element.nativeElement.classList.remove('stick');
}
}
}
如果用户在标题下滚动,则该指令的目的是添加类标记.因此,表头应该对用户可见,即使他滚动长表也是如此.棒类看起来像那样:
.stick {
position: fixed;
top: 55px;
}
我的some.component.html(和thead元素上的use指令)的一部分看起来像:
<table class=" table table-bordered ">
<thead sticky>
<tr>
<th width="40%">Name
</th>
<th width="10%">Priority
</th>
<th width="25%">Date created
</th>
<th width="25%">Date modified
</th> </tr> </thead> <tbody> <tr *ngFor="let r of …我有一个Angular应用程序,我想使用particles.js但是我不知道如何添加它并让它工作.
我把它添加到了.angular-cli.json
"scripts": [
"../node_modules/particles.js/particles.js"
],
我已将其导入我的组件
import * as particlesJS from 'particles.js';
并试图使用它来初始化它
particlesJS.load('particles-js', 'assets/particles.json', function() {
console.log('callback - particles.js config loaded');
});
有人有这个工作吗？
//In services.ts
import { Injectable } from '@angular/core';
import { Http, Headers, RequestOptions } from '@angular/http';
import 'rxjs/Rx';
@Injectable()
export class DataService {
constructor(private http: Http) { }
fetch(){
return this.http.get('json-object-link').map(
(res) => res.json()
)
}
}
//In component
ngOnInit() {
this.dataService.fetch()
.subscribe(
(data) => this.ninjas = data
);
}
我想在此请求中添加以下标头:
"headers":
{
"content-type":"application/json",
"access_token":"abcd"
}
我最近使用Angular-CLI创建了一个新的Angular4项目.
我遇到的问题是在安装angular2-notifications之后,运行ng lint命令时出错.
错误:
无法加载C:\ Users\Gabriel\Documents\GitHub\Go-NoGo\GoNoGo \node_modules\angular2-notifications\tslint.json:找不到自定义规则目录:C:\ Users\Gabriel\Documents\GitHub\Go- NOGO\GoNoGo \node_modules\angular2的通知\node_modules\codelyzer
堆栈跟踪 :
at new FatalError (C:\Users\Gabriel\Documents\GitHub\Go-NoGo\GoNoGo\node_modules\tslint\lib\error.js:40:23)
at Object.findConfiguration (C:\Users\Gabriel\Documents\GitHub\Go-NoGo\GoNoGo\node_modules\tslint\lib\configuration.js:47:15)
at files.forEach (C:\Users\Gabriel\Documents\GitHub\Go-NoGo\GoNoGo\node_modules\@angular\cli\tasks\lint.js:36:50)
at Array.forEach (native)
at lintConfigs.map (C:\Users\Gabriel\Documents\GitHub\Go-NoGo\GoNoGo\node_modules\@angular\cli\tasks\lint.js:30:19)
at Array.map (native)
at Class.run (C:\Users\Gabriel\Documents\GitHub\Go-NoGo\GoNoGo\node_modules\@angular\cli\tasks\lint.js:21:14)
at Class.run (C:\Users\Gabriel\Documents\GitHub\Go-NoGo\GoNoGo\node_modules\@angular\cli\commands\lint.js:45:25)
at Class.Command.validateAndRun (C:\Users\Gabriel\Documents\GitHub\Go-NoGo\GoNoGo\node_modules\@angular\cli\ember-cli\lib\models\command.js:128:15)
at C:\Users\Gabriel\Documents\GitHub\Go-NoGo\GoNoGo\node_modules\@angular\cli\ember-cli\lib\cli\cli.js:92:22
我已经转向谷歌这个问题,没有任何运气.我去过GitHub回购,也没有运气.
然后我进入tslint.json了angular2-notifications包的实际文件.
我在顶部看到这个:
"rulesDirectory": [
"node_modules/codelyzer"
],
当我删除这3行时,该ng lint命令有效.
我的问题是,我在这里遗漏了什么吗？我需要这个命令才能工作,我不认为修改包是一个可接受的解决方案.这是包装本身的一个错误,我应该向他们报告？
谢谢
在Angular 2.x中,Angular 2中的ng-model和NgModel之间有区别吗？请参阅以下Angular文档
https://angular.io/docs/ts/latest/guide/architecture.html
它使用术语[(ng-model)]="property"来解释双向数据绑定.在此之下,它使用NgModel(而不是ng-model)的示例
<input [(ngModel)]="hero.name">
如果这是一个错字,我很困惑(我猜不是!).
我是Angular的新手,我正在使用Angular 4,我使用Angular CLI,通过ng new命令创建了一个应用程序.
在main.ts中,我们有
...
import {AppModule} from './app/app.module';
.
.
platformBrowserDynamic().bootstrapModule(AppModule);
和AppModule定义(如你所见)app/app.module,这是我们所拥有的app.module.ts:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { AppComponent } from './app.component';
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
FormsModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
如你所见export class AppModule { },它也用于 platformBrowserDynamic().bootstrapModule(AppModule);
有人可以帮我解释一下吗？
angular ×10
javascript ×2
typescript ×2
css ×1
css-tables ×1
datepicker ×1
firebase ×1
html ×1
lint ×1
mailgun ×1
ng-bootstrap ×1
node.js ×1
npm ×1
particles.js ×1
pdf ×1
tslint ×1