小编Ara*_*ind的帖子

如何重置Redux商店的状态?

我正在使用Redux进行状态管理.
如何将商店重置为初始状态?

例如,假设我有两个用户帐户(u1u2).
想象一下以下一系列事件:

  1. 用户u1登录应用程序并执行某些操作,因此我们会在商店中缓存一些数据.

  2. 用户u1注销.

  3. 用户u2无需刷新浏览器即可登录应用程序.

此时,缓存的数据将与之关联u1,我想将其清理干净.

当第一个用户注销时,如何将Redux存储重置为其初始状态?

javascript store redux redux-store

397
推荐指数
13
解决办法
20万
查看次数

'找到合成属性@panelState.请在您的应用程序中包含"BrowserAnimationsModule"或"NoopAnimationsModule".

我使用angular-seed升级了Angular 4项目,现在得到了错误

找到合成属性@panelState.请在您的应用程序中包含"BrowserAnimationsModule"或"NoopAnimationsModule".

错误的屏幕截图

我怎样才能解决这个问题?究竟是什么错误信息告诉我?

typescript angular

125
推荐指数
7
解决办法
9万
查看次数

MongoDb使用Code 100关闭

我按照MongoDb Docs设置我的第一个MongoDb,

当我使用命令启动MongoDB时

C:\Program Files\MongoDB\Server\3.4\bin\mongod.exe
Run Code Online (Sandbox Code Playgroud)

我收到以下错误 在此输入图像描述

mongodb

78
推荐指数
7
解决办法
11万
查看次数

打字稿中的const和readonly之间的区别

打字稿中的常量vs只读

声明变量,readonly即使它们是公共属性,也不允许我们覆盖它.

const如何表现,

const SOME_VARIABLE:number = 10;
Run Code Online (Sandbox Code Playgroud)

如果我覆盖它的价值,它将如何运作?

typescript

40
推荐指数
5
解决办法
2万
查看次数

从angular2模板调用静态函数

我正在尝试为角度项目构建"实用程序"服务(类).实用程序类具有静态函数(因此我们不必实例化不必要的对象).一个例子是:

import { Injectable } from '@angular/core';

@Injectable()
export class DateService {
   constructor() {
   }

   public static parseDate(dateString: string): Date {
       if (dateString) {
           return new Date(dateString);
       } else {
           return null;
       }
   }
}
Run Code Online (Sandbox Code Playgroud)

在我的组件类文件中,然后我像这样导入它:

import { DateService } from '../utilities/date.service';
Run Code Online (Sandbox Code Playgroud)

在这样的类代码中工作:

ngOnInit():void {
  let temp = DateService.parseDate("2012/07/30");
  console.log(temp);  // Mon Jul 30 2012 00:00:00 GMT-0500 (Central Daylight Time)
 }
Run Code Online (Sandbox Code Playgroud)

但是,我希望能够在角度html模板中使用这些实用程序函数,如下所示:

<label for="date">Date</label>
          <input type="date" class="form-control" id="date" required
            [value]="event.date | date: 'yyyy-MM-dd'" (input)="event.date=DateService.parseDate($event.target.value)" name="date">
Run Code Online (Sandbox Code Playgroud)

不幸的是,这不起作用; 给出一个"无法读取属性'的parseDate'未定义"错误.

现在,我可以将'parseDate'函数移动到组件类,并且工作正常(当然,模板中需要更改)...但是,如果我有一堆组件,他们都需要有自己的'parseDate'功能,我想我们都知道这是一个不好扩展的坏主意.(请忽略parseDate函数的微不足道的性质)

此外,即使我不想实例化一个对象只是为了运行静态函数,我尝试使用实际的依赖注入.将它添加到providers数组,并在构造函数中构建一个实例 - …

angular

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

将Angular 4.x迁移到Angular 5

我已阅读以下博客和文档

并没有关于如何从4.x迁移到5的明确信息.

尝试以下命令

  • npm安装

    npm install @angular/{animations,common,compiler,compiler-cli,
                core,forms,http,platform-browser,platform-browser-dynamic,
                platform-server,router}@5.0.0
    
    Run Code Online (Sandbox Code Playgroud)
  • 纱线安装

    yarn add @angular/{animations,common,compiler,compiler-cli,
             core,forms,http,platform-browser,platform-browser-dynamic,
             platform-server,router}@5.0.0
    
    Run Code Online (Sandbox Code Playgroud)
  • 尝试了更新指南

     npm install @angular/animations@'^5.0.0' @angular/common@'^5.0.0' 
            @angular/compiler@'^5.0.0' @angular/compiler-cli@'^5.0.0' 
            @angular/core@'^5.0.0' @angular/forms@'^5.0.0'
            @angular/http@'^5.0.0' @angular/platform-browser@'^5.0.0' 
            @angular/platform-browser-dynamic@'^5.0.0' 
            @angular/platform-server@'^5.0.0' @angular/router@'^5.0.0' 
            typescript@2.4.2 rxjs@'^5.5.2'
    
     npm install typescript@2.4.2 --save-exact
    
    Run Code Online (Sandbox Code Playgroud)

没有什么比我好.请帮忙

angular angular5

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

检查组件上是否存在输出

考虑以下组件:

@Component({
  selector: 'app-test'
  template: 'Hello!'
}}
export class TestComponent {
  @Output() readonly selectionChange = new EventEmitter<SomeTypeHere>();
}
Run Code Online (Sandbox Code Playgroud)

随着电话:

<app-test (selectedChange)="selectedChangeHandler($event)"></app-test>
Run Code Online (Sandbox Code Playgroud)

请注意,我写的selectedChange不是正确的输出名称selectionChangestrictTemplates启用标志的 Angular 9根本没有帮助我。它默默地失败了。有趣的是,如果我对 做同样的事情@Input,应用程序会捕获错误并且不会编译。

如果我试图“听”一个不存在的东西,有什么办法可以抛出错误@Output吗?

angular-directive angular angular9

16
推荐指数
1
解决办法
1043
查看次数

Angular ui路由器具有路由(状态)参数的多个视图

我有一个页面,我使用多个视图显示2个不同的产品列表,每个视图都有一个控制器和模板文件.我的州定义是这样的:

    .state('all_lists', {
      url: '/lists',
      views: {
      '' : {templateUrl: 'my-lists.html'},
      'featured@all_lists' : {templateUrl: 'featured.html', controller: 'featuredCtrl'},
      'deals@all_lists' : {templateUrl: 'deals.html', controller: 'dealsCtrl'}
      }
     }
    )
Run Code Online (Sandbox Code Playgroud)

每个单独的列表顶部都有分页和排序过滤器,这些分页和排序过滤器作为状态参数添加到URL中.请告诉我如何为状态视图定义这些参数,以便将它们添加到URL中,然后在各个控制器中使用.

如果您更好地了解如何使用添加到网址的分页参数显示此类产品列表,请分享您的想法.任何帮助将不胜感激.

谢谢

注意: 请注意,我需要在1页上显示这两个列表.它的主页和特色项目列表,然后在热门交易下面显示项目列表,这两个列表都有分页,排序和其他一些过滤器.URL将是这样的.mydomain.com/products/featured-page_1/deals-page_2/perpage_10/

注2: 在经过大量研究和调查后,我发现这是一个平行状态的明显案例.请告诉我如何使用我当前使用的URL参数方案实现并行状态.

<html>
  <head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
    </head>
  <body>
    <div id="content">
      <h1>Products Homepage</h1>
      <h3>Some common filters for both lists</h3>
    <div id="featured">
      <h2>Featured List</h2>
      <div>pagination and other filters</div>
      <ul>
        <li>item 1</li>
        <li>item 2</li>
        <li>item 3</li>
        <li>item 4</li>
        <li>item 5</li>
      </ul>
      </div>
      <div id="deals">
        <h2>Hot Deals List</h2>
      <div>pagination …
Run Code Online (Sandbox Code Playgroud)

multiple-views angularjs angular-ui-router

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

如何在Angular 2及更高版本中实现模态对话框

我是棱角分明的新手.

我使用了包ng2-bootstrap使用了bootstrap模式.

我的查看文件是

<div bsModal #lgModal="bs-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title pull-left">Area Master</h4>
        <button type="button" class="close pull-right" (click)="lgModal.hide();" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        Modal Content here...

      </div>
      <div class="modal-footer">
        <button type="submit" class="btn btn-primary">Add</button>
      </div>
    </div>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

我需要知道如何从组件(类型脚本文件)中显示/隐藏此模式.

输入脚本文件是

import { Component, OnInit, ViewChild, ElementRef } from '@angular/core';
import { Router } from '@angular/router';
import { FormGroup, Validators, FormBuilder, FormControl } from '@angular/forms';
import { Area …
Run Code Online (Sandbox Code Playgroud)

ng2-bootstrap ngx-bootstrap angular

11
推荐指数
1
解决办法
3万
查看次数

Angular 4从模态获得形式值

当我提交表单时,我遇到了从模态中获取表单值的问题.日志说addMountForm是未定义的.我提供了我的html和组件的代码片段.我很感激你的帮助.

<ng-template #content let-c="close" let-d="dismiss">
   <div class="modal-header">
      <h3 class="modal-title">Add Mount Point</h3>
   </div>
   <div class="modal-body">
      <form (ngSubmit)="onSubmit()" #addMountForm="ngForm" >
         <div class="form-group">
            <label class="col-sm-2 control-label text-nowrap"
               for="archiveOrigin">Archive Origin</label>
            <div class="col-sm-10">
               <input type="text" class="form-control" ngModel id="archiveOrigin" name="archiveOrigin" placeholder="Archive Origin"/>
            </div>
         </div>

               <button type="submit" class="btn btn-default">Add</button>

      </form>
   </div>
   <div class="modal-footer">
      <button type="button" class="btn btn-default" (click)="c('Close click')">
      Close
      </button>
   </div>
</ng-template>
<div class="page pt-2">

</div>


@Component({
  selector: 'mount-point',
  templateUrl: './mountpoint.component.html',
  styleUrls: ['./mountpoint.component.scss']
})
export class MountPointComponent implements OnInit {

@ViewChild('addMountForm') addMountForm : NgForm;

  constructor(
    private …
Run Code Online (Sandbox Code Playgroud)

ng-bootstrap angular

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