小编Wil*_*ire的帖子

何时不在AngularJS ng-repeat中使用'追踪$ index'?

我最近得到了控制台错误`

错误:不允许在转发器中使用[ngRepeat:dupes]重复项.使用'track by'表达式指定唯一键...

- AngularJS错误参考 - ngRepeat:dupes

然后我使用'track by $index'了,问题解决了......

但这让我思考......你有没有理由不想track by $index在ng-repeat中使用?

我已经阅读过像这样的问题以及其他文章,但似乎几乎所有的文章都只谈论使用的优点'track by'.

有人可以列出缺点并举例说明你何时不想使用track by $index

angularjs angularjs-ng-repeat

12
推荐指数
2
解决办法
9028
查看次数

Angular 6 Update - 找不到rxjs-5-to-6-migrate命令

update.angular.io的升级过程中:

使用rxjs-tslint自动更新规则删除已弃用的RxJS 6功能.

对于大多数应用程序,这将意味着运行以下两个命令:

npm install -g rxjs-tslint
rxjs-5-to-6-migrate -p src/tsconfig.app.json
Run Code Online (Sandbox Code Playgroud)

但是,当我按照这些步骤运行时,rxjs-5-to-6-migrate -p src/tsconfig.app.json我收到错误:

rxjs-5-to-6-migrate: command not found
Run Code Online (Sandbox Code Playgroud)

这个命令不起作用有什么原因吗?

rxjs angular angular6

12
推荐指数
3
解决办法
6563
查看次数

在Angular中没有正文的HTTP Post

我想知道如何在没有正文的情况下发送HTTP post请求(特别是在Angular中).这就是我现在正在做的事情,但我收到了错误Expected 2-3 arguments, but got 1).

我意识到第二个参数是针对正文的,但我并没有将它发送到服务器(是的,我知道POST调用改变了系统的状态并且已经查看了这个问题).

postRequest(id) {
  this.http.post('/api?data=' + id).map(
    (response) => {
      return response;
    }
  )
}
Run Code Online (Sandbox Code Playgroud)

http typescript angular-http angular

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

更改工具栏素材设计的高度

如何在材料设计中更改md-toolbar的高度?

http://jsfiddle.net/kostonstyle/gsroofa5/

在第一个工具栏上,我想要一个30px的高度并尝试:

<md-toolbar style:"height: 30px;">
Run Code Online (Sandbox Code Playgroud)

但它根本不起作用.我需要一个带有两个散装的导航栏,因为有两个工具栏.

我试试这个,但现在信件消失了.

http://jsfiddle.net/kostonstyle/r178sp9o/1/

angularjs angular-material

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

Angular 2 FormBuilder禁用复选框选择上的字段

我已经构建了角度cli项目并且有一个带复选框的表单.某些字段必须在复选框选择时禁用.

表格如下 在此输入图像描述

需要在复选框选择事件上禁用/启用密码,新密码和重新键入密码字段.

HTML

<form [formGroup]="userProfileForm" (ngSubmit)="submitForm(userProfileForm.value)">

    <div class="row">
        <div class="col">
            <div class="form-group">
                <label> {{ 'USER_PROFILE_MODEL.USER_NAME' | translate }}</label>
                <input class="form-control" type="text" [formControl]="userProfileForm.controls['userName']">
            </div>
            <div class="form-group ">
                <label>{{ 'USER_PROFILE_MODEL.DISPLAY_NAME' | translate }}</label>
                <input class="form-control" type="text" [formControl]="userProfileForm.controls['displayName']">
            </div>
            <div class="form-group ">
                <label>{{ 'USER_PROFILE_MODEL.EMAIL' | translate }}</label>
                <input class="form-control" type="text" [formControl]="userProfileForm.controls['email']">
            </div>
        </div>
        <div class="col">
            <div class="form-group ">
                <label class="checkbox-inline">
                <input type="checkbox" value="isResetPassword" name="isResetPassword" [formControl]="userProfileForm.controls['isResetPassword']">  
                 {{ 'USER_PROFILE_MODEL.RESET_PASSWORD' | translate }}
              </label>
            </div>
            <div class="form-group ">
                <label>{{ 'USER_PROFILE_MODEL.PASSWORD' | translate }}</label>
                <input class="form-control" …
Run Code Online (Sandbox Code Playgroud)

javascript angular2-forms angular

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

无法处理动画 - 返回零元素

一旦我为我的数据创建了一个服务,动画就停止工作了。看起来是因为当页面最初加载时,ng-repeat 中没有元素(因为它正在获取数据)。似乎与THISTHIS类似:

错误:

ERROR Error: Unable to process animations due to the following failed trigger transitions @listAnimation has failed due to:

- `query(":enter")` returned zero elements. (Use `query(":enter", { optional: true })` if you wish to allow this.)
Run Code Online (Sandbox Code Playgroud)

动画片:

trigger('listAnimation', [
      transition('* => *', [
        query(':enter', style({ opacity: 0}), { optional: true }),
        query(':enter', stagger('150ms', [
          animate('.5s ease-in', keyframes([
            style({ opacity: 0, /*transform: 'translateY(-75px)',*/ offest: 0}),
            style({ opacity: .5, /*transform: 'translateY(35px)',*/ offest: .3}),
            style({ opacity: 1, …
Run Code Online (Sandbox Code Playgroud)

typescript angular angular-animations

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

rxJs&angular 4&restangular:stack errorInterceptors

在我的角度4应用程序中,我正在使用ngx-restangular来处理所有服务器调用.它返回可观察的结果,并且该模块具有处理错误的钩子(如401等).

但是从文档中,我可以处理403(401)所以:

  RestangularProvider.addErrorInterceptor((response, subject, responseHandler) => {
    if (response.status === 403) {

      refreshAccesstoken()
      .switchMap(refreshAccesstokenResponse => {
        //If you want to change request or make with it some actions and give the request to the repeatRequest func.
        //Or you can live it empty and request will be the same.

        // update Authorization header
        response.request.headers.set('Authorization', 'Bearer ' + refreshAccesstokenResponse)

        return response.repeatRequest(response.request);
      })
      .subscribe(
        res => responseHandler(res),
        err => subject.error(err)
      );

      return false; // error handled
    }
    return true; // error …
Run Code Online (Sandbox Code Playgroud)

observable rxjs restangular angular

5
推荐指数
1
解决办法
964
查看次数

Angular 4 node_modules

我正在学习 Angular 4 并计划在本周末构建一个应用程序。

node_modules是巨大的。217 MB 用于 JavaScript 框架和 node_modules 下的 700 多个子目录!

现在,我确实查看了生成的 HTML,它似乎没有引用node_modules.

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>MyApp</title>
  <base href="/">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
  <app-root></app-root>
  <script type="text/javascript" src="inline.bundle.js"></script>
  <script type="text/javascript" src="polyfills.bundle.js"></script>
  <script type="text/javascript" src="styles.bundle.js"></script>
  <script type="text/javascript" src="vendor.bundle.js"></script>
  <script type="text/javascript" src="main.bundle.js"></script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

问题:我可以不部署 node_modules 吗?Angular 4 还能正常运行吗?

javascript angular

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