小编FRE*_*CIA的帖子

我希望div使用css从角度2向右滑入.

  <div class="note" [ngClass]="{'transition':show}" *ngIf="show">
    <p> Notes</p>
  </div>
  <button class="btn btn-default" (click)="toggle(show)">Toggle</button>

如果我只使用[ngClass]切换类并使用不透明度,我工作正常.但是李不希望从一开始就渲染这个元素,所以我首先用ngIf"隐藏"它,但是转换不会起作用.

.transition{
  -webkit-transition: opacity 1000ms ease-in-out,margin-left 500ms ease-in-out;
  -moz-transition: opacity 1000ms ease-in-out,margin-left 500ms ease-in-out;
  -ms-transition: opacity 1000ms ease-in-out,margin-left 500ms ease-in-out ;
  -o-transition: opacity 1000ms ease-in-out,margin-left 500ms ease-in-out;
  transition: opacity 1000ms ease-in-out,margin-left 500ms ease-in-out;
  margin-left: 1500px;
  width: 200px;
  opacity: 0;
}

.transition{
  opacity: 100;
  margin-left: 0;
}

首先,我查了一下,但没有发现任何文章涉及我的问题.

如何在angularJS内置指令中访问预定义的js全局变量？

例如,我在中定义了这个变量 <script>var variable1 = true; </script>

然后我写了一个AngularJS指令:

<div ng-if="variable1">Show some hidden stuff!</div>

这不起作用.

然后我被告知我应该使用 ng-init

所以我在其他地方编写了代码:

<div ng-init = "angularVariable1 = variable1"></div>

这显然不起作用......这就像一个恶性循环.你需要访问预定义的js全局变量,然后你需要使用ng-init; 为了使用ng-init,您需要访问全局变量.

有什么特别的方法吗？

我在angular2中使用webpack,当我尝试运行我的应用程序时,我得到一个错误说明

找不到模块"@ angular/animations"

的package.json

{
  "name": "angular-quickstart",
  "version": "1.0.0",
  "description": "QuickStart package.json from the documentation, supplemented with testing support",
  "scripts": {
    "start": "tsc && concurrently \"tsc -w\" \"lite-server\" ",
    "e2e": "tsc && concurrently \"http-server -s\" \"protractor protractor.config.js\" --kill-others --success first",
    "lint": "tslint ./app/**/*.ts -t verbose",
    "lite": "lite-server",
    "pree2e": "webdriver-manager update",
    "test": "tsc && concurrently \"tsc -w\" \"karma start karma.conf.js\"",
    "test-once": "tsc && karma start karma.conf.js --single-run",
    "tsc": "tsc",
    "tsc:w": "tsc -w"
  },
  "keywords": [],
  "author": "",
  "license": "MIT",
  "dependencies": { …

我正在尝试使用Angular2动画系统,用于伪元素:before.根据动画流程,我需要定义动画状态:

animations: [
trigger('heroState', [
  state('inactive', style({
    backgroundColor: '#eee',
    transform: 'scale(1)'
  })),
  state('active',   style({
    backgroundColor: '#cfd8dc',
    transform: 'scale(1.1)'
  })),
  transition('inactive => active', animate('100ms ease-in')),
  transition('active => inactive', animate('100ms ease-out'))
])]

然后将其附加到DOM元素,如下所示:

<ul>
<li *ngFor="let hero of heroes"
    [@heroState]="hero.state"
    (click)="hero.toggleState()">
  {{hero.name}}
</li>

但是,我想将其附加到伪before元素.我怎样才能做到这一点？

我的服务中有以下代码

myService.ts

makeHttpGetRequest(url){

        return Observable.interval(config.SUPERVISOR_REFRESH_INTERVAL * 1000)
            .switchMap(() => this.http.get(url))
            .map(res => res.json())
            .timeout(config.REQUEST_TIMEOUT * 1000, new Error('Time out occurred'))

    }

在我的组件文件中

myComponent.ts

ngOnInit(){
        this._myService.makeHttpGetRequest(myurl)
            .subscribe(
                data => {
                    this.supervisorServers = data;
                    }

                },
                error => {
                    this.error = true;
                    console.log(error); //gives an object at this point
                    this.showError(error);
                }
            );
    }

我想在例如Invailid url的情况下打印错误消息.当我打印错误时,我得到一个对象(可能是响应对象),如下所示:

Object { _body: error, status: 200, statusText: "Ok", headers: Object, type: 3, url: null }

如果我打开它,我找不到错误信息.是否有更好的方法来获取precies错误消息？

您好我正在开发一个大型应用程序,我遇到了一些变更检测问题.我将尝试尽可能地解释我的设置.

父组件ts:

运用 changeDetection: ChangeDetectionStrategy.OnPush

我有一个可观察的变量

loaderOverlay$: Observable<boolean>;

this.loaderOverlay$ = this.store.pipe(
  select(selectors.loaderOverlaySelector)
);

此变量从子组件的rxjs操作更新.然后通过rxjs进程.(动作 - >减速器 - >选择器)

父组件HTML

<div *ngif="(loaderOverlay$ | async)"></div>

孩子#1组件(我发送我的动作):

myFunction() {
  this.store.dispatch(new actions.LoaderOverlay(true));
}

我的问题是,一旦我发出动作,*ngif就会非常不稳定.它似乎没有按照我想要的方式工作(调度操作,将值更改为true以便显示div).这很奇怪,因为如果我console.log(action.payload)在reducer中,该值实际上正在更新,但*ngif它不起作用.甚至更奇怪的是,当我将鼠标悬停在其他组件上时,它似乎开始了.

我花了很多时间在这上面,我想我已经缩小了它以改变检测,因为在父组件中如果我这样做:

ngAfterViewChecked(){
   this.changeDetector.detectChanges();
}

它似乎对我有用.我的问题是,ngAfterViewChecked似乎被触发了很多次,我害怕性能问题.

以前有没有人遇到过这个问题？或者有没有人对于发生了什么以及我可以做些什么来解决这个奇怪的问题？

谢谢!

假设我在固定导航栏中有2个路由组件和两个Routerlink来路由它们.当我点击Routerlinks时,我希望它们从右侧滑入.

我不想用css来偏移组件,并使用超时函数来更改css类以让它滑入(例如使用ngStyle或ngClass).

在Angular 2中有没有更优雅的方法来实现这一目标？

谢谢!

安装模块后 socket.io

npm install socket.io --save

我有以下错误:

错误TS2307:找不到模块'socket.io-client'

进口

import * as io from 'socket.io-client';

systemjs.config.js

var map = {
    'socket.io-client': 'node_modules/socket.io-client/socket.io.js'
}

var packages = {
    'socket.io-client': { main: 'socket.io', format: 'cjs', defaultExtension: 'js' }
}

的package.json

"dependencies": {
    "socket.io": "^1.4.8"
}

typings.d.ts

/// <reference path="../socket.io-client/socket.io.js" />

declare module 'socket.io-client' {
  var e: any;
  export = e;
}

socket.io-client(目录)
- socket.io.js
- typings.d.ts

Angular 2 RC5

我一直在摆弄Angular动画,并想知道是否有最佳/推荐的方法来避免内联样式...例如,

@Component({
selector: 'page-that-needs-anime',
templateUrl: './anime.component.html',
styleUrls: ['./anime.component.scss'],
animations: [
trigger('animeTrigger', [
state('in', style({transform: 'translateY(0)'})),
transition('void => *', [
  animate(700, keyframes([
    style({opacity: 0, transform: 'translateY(-100%)', offset: 0}),
    style({opacity: 1, transform: 'translateY(25px)',  offset: 0.3}),
    style({opacity: 1, transform: 'translateY(0)',     offset: 1.0})
  ]))
]) //you get the idea ... *Import statement is taken out for brevity

无论如何,"动画"可以使用类似styleUrls&templateUrl的引用吗？我见过有人把它称为const但是想知道是否有'Angular官方'方式.

此代码应该只取消关注没有追踪的用户,但它取消了一些粉丝,无法弄清楚原因.

$oTwitter = new TwitterOAuth (...)

$aFollowing = $oTwitter->get('friends/ids');
$aFollowing = $aFollowing->ids;
$aFollowers = $oTwitter->get('followers/ids');
$aFollowers = $aFollowers->ids;

$i=1;
foreach( $aFollowing as $iFollowing )
{
$isFollowing = in_array( $iFollowing, $aFollowers );

echo "$iFollowing: ".( $isFollowing ? 'OK' : '!!!' )."<br/>";

if( !$isFollowing )
{
$parameters = array( 'user_id' => $iFollowing );
$status = $oTwitter->post('friendships/destroy', $parameters);
} if ($i++ === 100 ) break;
}

难道问题不是别的吗？

编辑:为这篇文章添加了自己的答案,其代码可以关注关注者并在Twitter上取消关注非关注者.