小编Jul*_*ius的帖子

Angular Material DatePicker - 错误:MdDatepicker:找不到DateAdapter的提供程序

以下材料文档,我:

import {MdDatepickerModule} from '@angular/material';
Run Code Online (Sandbox Code Playgroud)

在根模块中并将其添加到提供程序列表中,但是不能在模板中使用它.得到此错误:

未捕获(承诺):错误:MdDatepicker:找不到DateAdapter的提供程序.您必须在应用程序根目录中导入以下模块之一:MdNativeDateModule,或提供自定义实现.

所以根据它,我删除了最后一个导入并添加:

import {MdNativeDateModule} from '@angular/material';
Run Code Online (Sandbox Code Playgroud)

现在,看起来,它的工作原理.为什么Material docs会导致导入MdDatepickerModule,但不是MdNativeDateModule?它们有何区别?

material angular

15
推荐指数
2
解决办法
3万
查看次数

无法直接访问FormControl实例.无法读取未定义的属性"无效"

无法以与Angular文档相同的方式访问它,因此必须首先获取FormGroup实例并在那里找到FormControl实例.我想知道为什么?这个例子有效:

<form [formGroup]="myForm" (ngSubmit)="onSubmit()">
  <div class="form-group">
    <label for="username">Username</label>
    <input 
      type="text"
      name="username"
      class="form-control"
      formControlName="username"
    >
    <div *ngIf="myForm.controls.username.invalid" class="alert alert-danger">
      username is required
    </div>
  </div>
Run Code Online (Sandbox Code Playgroud)

虽然这会引发错误(仅在*ngIf语句中这些差异):

<form [formGroup]="myForm" (ngSubmit)="onSubmit()">
  <div class="form-group">
    <label for="username">Username</label>
    <input 
      type="text"
      name="username"
      class="form-control"
      formControlName="username"
    >
    <div *ngIf="username.invalid" class="alert alert-danger">
      username is required
    </div>
  </div>
Run Code Online (Sandbox Code Playgroud)

无法读取未定义的属性"无效"

form.component:

import {Component} from '@angular/core';
import {FormGroup, FormControl, Validators} from '@angular/forms';

@Component({
  selector: 'sign-up',
  templateUrl: 'app/sign-up.component.html'
})

export class SignUpComponent {

  myForm = new FormGroup({
    username: new FormControl('username', Validators.required),
    password: new FormControl('', Validators.required), …
Run Code Online (Sandbox Code Playgroud)

angular2-forms angular angular-reactive-forms

14
推荐指数
3
解决办法
2万
查看次数

Array.prototype.splice - 帮助理解课程

这是教程中的一个函数:

function add() {
    var values = Array.prototype.splice.call(arguments, [1]),
        total = 0;

    for(var value of values) {
        total += value;
    }

    return total;
}
Run Code Online (Sandbox Code Playgroud)

资源

这个表达Array.prototype.splice.call(arguments, [1])让我很困惑.

  1. 为什么1
  2. 为什么用括号[1]

如果我们传递1,它表示start位置splice(),所以它将跳过我们传递给的第一个参数add(),因此它不会添加所有参数......

这是教程中的错误吗?

javascript

9
推荐指数
2
解决办法
510
查看次数

Angular4 - npm jQuery错误TS1005:','预计

我的项目一直很好,直到我通过以下方式安装jquery包:

npm install jquery
Run Code Online (Sandbox Code Playgroud)

和:

npm install -D @types/jquery
Run Code Online (Sandbox Code Playgroud)

在此之后我遇到了一些错误,并决定在索引文件中通过脚本标签使用jQuery.所以试图卸载已安装的软件包:

npm uninstall jquery
npm uninstall @types/jquery
Run Code Online (Sandbox Code Playgroud)

也试过sudo和/或--save和/或--save-dev喜欢:

sudo npm uninstall jquery --save-dev
Run Code Online (Sandbox Code Playgroud)

根据控制台的说法,卸载进度很顺利:

在2.199s中删除了1个包

但是在尝试npm start:

node_modules/@types/jquery/index.d.ts(47,40):错误TS1005:','预计.node_modules/@types/jquery/index.d.ts(2370,40):错误TS1005:','预计.node_modules/@types/jquery/index.d.ts(2372,46):错误TS1005:','预期.node_modules/@types/jquery/index.d.ts(2483,23):错误TS1005:','预计.等等......

然后注意到nodemodules/@types仍然包含jquery所以我手动删除它,但然后:

node_modules/@types/angular-animate/index.d.ts(6,1):错误TS2688:找不到'jquery'的类型定义文件.node_modules/@types/angular/index.d.ts(6,1):错误TS2688:找不到'jquery'的类型定义文件.node_modules/@types/angular/index.d.ts(86,18):错误TS2304:找不到名称'JQueryStatic'.node_modules/@types/angular/index.d.ts(2004,46):错误TS2304:找不到名称'JQueryStatic'.src/app/search.component.ts(14,19):错误TS2339:类型"{}"上不存在属性"目标".错误的ERR!代码ELIFECYCLE npm ERR!错误2 npm ERR!angular-tut@1.0.0 build:tsc -p src/npm ERR!退出状态2

据我所知,在安装jQuery后,我还更改了其他node_modules(@ types/angular)?

更新:


正如@selemmn推荐的那样我试图删除catch:

rm -r node_modules

npm cache clean 在此之后:

错误的ERR!从npm @ 5开始,npm缓存会自行修复损坏问题,并保证从缓存中提取的数据有效.如果要确保一切都一致,请改用"npm cache verify".错误的ERR!错误的ERR!如果您确定要删除整个缓存,请使用--force重新运行此命令.

所以:

npm cache clean --force

npm install

并得到这个错误:

node-pre-gyp ERR!stack TypeError:无法读取null的属性'version'

所以从gitHub …

jquery angular

8
推荐指数
2
解决办法
1万
查看次数

用于创建和编辑Angular4数据的相同形式

这是一个带有两个方式绑定输入字段的表单.目标是创建相同的表单来编辑和创建数据.这已经完成,但我很确定可以有更好的方法来实现这一点(比如使用AbstractControl功能).我也错过了一个修复程序 - 如果clickEdit()被点击,则需要使用该用户想要编辑的对象更新表单值.感谢您提供任何帮助,尤其是解释AbstractControlNgModel...

<div>
<form (ngSubmit)="clicked ? onEditSubmit($event) : onRegisterSubmit($event)" [formGroup] = "form">
  <div class="form-group">
    <label>Full Name</label>
    <input type="text" [(ngModel)]="fullname" formControlName="fullname" class="form-control" >

  </div>
  <div class="form-group">
    <label>Username</label>
    <input type="text" [(ngModel)]="username" formControlName="username" class="form-control" >
  </div>
  <div class="form-group">
    <label>Email</label>
    <input type="text" [(ngModel)]="email" formControlName="email" class="form-control" >
  </div>
  <div class="form-group">
    <label>Password</label>
    <input type="password" [(ngModel)]="password" formControlName="password" class="form-control">
  </div>
  <button type="submit" class="btn btn-primary" [disabled]="!form.valid"> Submit </button>
</form>
</div>

<br>
<br>

<table  border="2" class="table table-striped">
<tr>
  <th>Full Name</th>
  <th>Username</th>
  <th>Email</th>
  <th>Password</th> …
Run Code Online (Sandbox Code Playgroud)

angular-ngmodel angular

8
推荐指数
2
解决办法
4万
查看次数

是否可以显示由Firebase身份验证生成的$ uid?

我启用了Firebase身份验证,在注册新用户后,我创建了一些其他数据表,我将其区分开来$uid,由Firebase生成.也在$uid浏览器地址栏中显示,如:

http://localhost:4200/accounts/6WvgabEHMRbGYxJ0inaCjWHmkif2
Run Code Online (Sandbox Code Playgroud)

以这种方式使用它是否足够安全(这是正常做法)?

security firebase firebase-authentication

8
推荐指数
1
解决办法
302
查看次数

Angular Material,Md-datepicker-输入单击时打开日期选择器

我想打开日历,不仅用户单击日历图标,而且单击输入字段时,用户都可以从日期选择器中选择日期。物料DatePicker。因此,我为此创建了指令,将其附加到输入,<md-datepicker>并监视(click)输入事件:

HTML:

  <md-form-field class="field-half-width">
    <input mdInput [mdDatepicker]="picker2" placeholder="Galioja iki"
            formControlName="dateUntil" (click)="clickInp()">
    <md-datepicker-toggle  id="calendar" mdSuffix [for]="picker2" ></md-datepicker-toggle>
    <md-datepicker #picker2 manualClickRenderer></md-datepicker>
  </md-form-field> 
Run Code Online (Sandbox Code Playgroud)

表单组件:

import {ManualClickRerender} from '../shared/directives/manual-click.directive';

@Component({
  selector: 'form',
  providers: [ManualClickRerender]
})

export class FormComponent implements OnInit, OnChanges {
 ...
  clickInp() {
    this.manualClickRerender.botClick();
  }
Run Code Online (Sandbox Code Playgroud)

指示:

import { Directive, Renderer, ElementRef } from '@angular/core';
@Directive({
  selector: '[manualClickRenderer]'
})
export class ManualClickRerender {

  private nativeElement : Node;

  constructor( private renderer : Renderer, private element : ElementRef ) …
Run Code Online (Sandbox Code Playgroud)

javascript typescript angular-material angular-material2 angular

8
推荐指数
4
解决办法
7677
查看次数

如何从`rxjs`包中正确导入运算符

我很困惑如何导入这些运算符.有些我可以导入, import 'rxjs/add/operator/do';有些我不能.例如,这不起作用:( import 'rxjs/add/operator/map';我在rxjs/add/operator中检查过,map存在于那里).

基本上我想要做的是在Angular4中重现这个:

var requestStream = Rx.Observable.just('https://api.github.com/users');

var responseStream = requestStream
  .flatMap(function(requestUrl) {
    return Rx.Observable.fromPromise(jQuery.getJSON(requestUrl));
  });

responseStream.subscribe(function(response) {
  // render `response` to the DOM however you wish
});
Run Code Online (Sandbox Code Playgroud)

我也想知道如何处理just运算符,因为我在rxjs/add/operator中看不到它...

谢谢你的帮助

rxjs angular

7
推荐指数
1
解决办法
5597
查看次数

未定义的方法`marked_for_destruction?' CarrierWave,RMagick

我正在传递由Carrierwave上传的裁剪图像的功能.这是我关注的Youtube上的RailsCast视频.

但在将RMagick包含在上传器中之后,我收到了:

undefined method `marked_for_destruction?' for #<ImageUploader:0x007fe86634fcf0>
Run Code Online (Sandbox Code Playgroud)

我觉得这真是太糟糕了.我没有在任何地方调用此方法.但如果没有定义,我们来定义它!它奏效了!但后来我检查了更多有关此方法的信息,发现它内置于Active Record Autosave Association模块中.从docs,关于这个方法:

返回此记录是否将作为父保存事务的一部分销毁.

仅在为此关联模型启用父级上的:autosave选项时才有用.

但我没有传递autosave: true给任何对象!

所以,我的第一个问题 - 默认是以某种方式完成的吗?

2 - 在RailsCast教程中,他没有定义这个方法.我为什么要这样做?

3 - 我传递了我的代码.有错误吗?

4 - 如果可能的话,任何人都能解释一下这个过程是如何运作的吗?

非常感谢!

product.rb:

  has_one :image
  validates :image, presence: true
  mount_uploader :image, ImageUploader
Run Code Online (Sandbox Code Playgroud)

products_controller.rb:

  def create
    @product = Product.new(product_params)
    @product.category_id = params[:category_id]
    @product.user_id = current_user.id

    respond_to do |format|
      if @product.save
        if params[:product][:image].present?
          format.html { render :crop }
        else
          format.html { redirect_to @product, notice: 'Product was successfully created.' }
          format.json …
Run Code Online (Sandbox Code Playgroud)

rmagick carrierwave ruby-on-rails-5

6
推荐指数
1
解决办法
1373
查看次数

Firestore + AngularFire2 分页(按范围查询项目 - .startAfter(lastVisible) )

在一个组件中,我想从 FireStore 中提取一系列项目,例如。从 0 到 5,从 5 到 10 等等。我在 FireStore 的文档中找到了这个,但是他们不使用 AngularFire2,所以我尝试重构时变得更加混乱。我通过简单的splice()'ing使它工作:

service ->

topFirstScores(): AngularFirestoreCollection<Score> {
  return this.fireRef.collection('scores', r => r
          .orderBy('score', 'desc').limit(6)
  );
}

component ->

$scores = new Subject();

this.scores$ = this.$scores.asObservable();
if (this.scores === 'first') {
  this.scoreS.topFirstScores().valueChanges().take(1)
    .subscribe(_ => this.$scores.next(_.splice(0, 3)))
} else {
  this.scoreS.topFirstScores().valueChanges().take(1)
    .subscribe(_ => this.$scores.next(_.splice(3, 3)))
}
Run Code Online (Sandbox Code Playgroud)

但这似乎更像是一种解决方法。谁能翻译一下:

var first = db.collection("cities")
        .orderBy("population")
        .limit(25);

return first.get().then(function (documentSnapshots) {
  // Get the last visible document
  var lastVisible = documentSnapshots.docs[documentSnapshots.docs.length-1]; …
Run Code Online (Sandbox Code Playgroud)

rxjs angularfire2 angular google-cloud-firestore

6
推荐指数
1
解决办法
7131
查看次数