小编Yan*_*aim的帖子

无法从我的控制器/构造函数访问输入

我有一个简单的Angular 2组件@Input,我绑定到模板.模板显示输入数据,但我无法从构造函数访问它:

import {Component, View, bootstrap, Input} from 'angular2/angular2';
import DataService from './data-service';

@Component({
    selector: 'app-cmp'
})
@View({
    template: `{{data.firstName}} {{data.lastName}}` //-> shows the correct 'data'
})
export default class NamesComponent {
  @Input() data: any;
  constructor(dataService: DataService) {
    console.log(this.data);//undefined
  }
}
Run Code Online (Sandbox Code Playgroud)

这是一个带有示例的plunker(参见"names-component.ts").

我究竟做错了什么?

typescript angular

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

Angular 2.0和ng-style

我正在构建一个Angular 2.0组件,我想动态地控制它的样式(使用ng-style).在快速查看Angular 2的文档后,我尝试了这个:

<div class="theme-preview" ng-style="{'font-size': fontSize}">
  {{fontSize}}
</div>
Run Code Online (Sandbox Code Playgroud)

并且看到尺寸实际上印在div内但没有影响风格.fontSize是组件的属性绑定之一',这意味着组件从它的父节点获取它,如下所示:

<my-component [font-size]="size" />
Run Code Online (Sandbox Code Playgroud)

在组件内部,我有:

@Component({
  selector: 'XXX',
  properties: ['fontSize']
})
Run Code Online (Sandbox Code Playgroud)

我在这里错过了什么吗?

javascript angular

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

Safari - iPhone模拟器调试(通过"开发")不再显示

我正在使用iPhone模拟器运行UIWebview和Safari浏览器(在我的Mac上)以调试js/html/css代码(通过"开发"菜单 - > iPhone模拟器 - >选择我的webview).

Yestarday,iPhone模拟器选项从我的"开发"菜单中消失了:(正如你所看到的,这里缺少"iphone-simulator"(它在后台打开并正常工作......)

在此输入图像描述

任何的想法?

编辑:我正在使用iOS 7 iPhone模拟器+ Safari 7

编辑2:刚尝试在iphone-simulator的Safari浏览器上打开一个网站(除了UIWebview).这里没有运气......

uiwebview ios ios-simulator

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

Angular 2 - 使用"升级适配器"升级时是否可以使用新路由器

我正在使用升级适配器逐步升级我的应用程序.我的应用程序使用ui-router(+有子路由).

我在Angular 2中阅读了这篇关于路由的好文章.我的问题是:

是否可以在Angular 1.X app +升级适配器中使用新路由器?

例如:

我有一个角度1.X模板<div ui-view=""></div>.当我将它升级为Angular 2.0组件时,我必须使用新的组件路由器,因为Angular 2.0现在正在渲染这个组件.但是,为了使用它,我应该这样做:

bootstrap(App, [provide(LocationStrategy, { useClass: PathLocationStrategy })])
Run Code Online (Sandbox Code Playgroud)

使用Upgrade Adater引导时我没有这个!

我应该首先将引导程序移动到Angular 2,然后再移动到Component路由器吗?

谢谢

javascript angular-ui-router angular

14
推荐指数
1
解决办法
484
查看次数

在Angular 2.0中更改检测

我有一个Angular2.0组件:

import {Component, View, FORM_DIRECTIVES} from 'angular2/angular2';

@Component({
  selector: 'font-size-component',
  properties: ['fontSize'],
  events: ['fontSizeChanged']
})
@View({
  template: `<input id="fontSize" [(ng-model)]="fontSize"/>`,
  directives: [FORM_DIRECTIVES]
})
export class FontSizeComponent {
  constructor() {

  }
}
Run Code Online (Sandbox Code Playgroud)

现在,我希望此组件在输入更改时触发事件(使用事件绑定).

在Angular 1.XI上有几个选项(ng-change$scope.$wacth).我正在寻找类似的解决方案,所以当输入更改时,我将能够使用eventemitter并触发fontSizeChanged事件.

谢谢,

的Yaniv

typescript angular

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

ReactDom未定义

我正在使用React与Webpack和Babel.我收到运行时错误:

未捕获的ReferenceError:未定义ReactDom

我的反应版本是:

"devDependencies": {
   "phantomjs-polyfill": "0.0.2",
   "react-addons-test-utils": "^0.14.8"
 },    
 "dependencies": {
   "react": "^0.14.7",
   "react-dom": "^0.14.7"
 },
Run Code Online (Sandbox Code Playgroud)

我的代码是:

import React from 'react';
import ReactDOM from 'react-dom';
import Main from './components/main';

ReactDom.render(<Main />, document.getElementById('root'));
Run Code Online (Sandbox Code Playgroud)

我究竟做错了什么?

javascript reactjs webpack babeljs react-dom

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

Angular 2.0 - Injected Http服务未定义

评论 - 我设法解决了这个问题,请参阅本文的底部

我正在使用UpgradeAdapter(ngUpgrade)升级我的Angular 1.X应用程序.我添加了一个新的Angular 2.0服务,我从我的Angular 2.0组件中调用它:

服务:

import {Inject} from 'angular2/core';
import {Http} from 'angular2/http';
import {Observable} from 'rxjs/Observable';

export default class MyService {
  _http;
  constructor(http: Http) {
    this._http = http; //http is undefined here
  }

  getData(): Observable<any> {
    return this._http.get(someUrl);
  }
}
Run Code Online (Sandbox Code Playgroud)

在我的内心我bootstrap.ts:

declare var angular: any;

import {UpgradeAdapter} from 'angular2/upgrade';
import {Http} from 'angular2/http';

let adapter = new UpgradeAdapter();

adapter.addProvider(Http);

//.....

adapter.bootstrap(document.body, ['myApp']);
Run Code Online (Sandbox Code Playgroud)

我在这做错了什么?

编辑:

我正在向Angular 2.0服务注入另一项服务(Angular 1.X升级服务),它确实有效:

import {Inject} from 'angular2/core';
import {Http} …
Run Code Online (Sandbox Code Playgroud)

typescript angular

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

Android(三星S4)HTML5视频暂停

我正在使用Android Webview播放html5视频,包括Youtube视频(我自己的标签和Youtube嵌入式iFrame).在以下情况下,我遇到了Samsung Galaxy S4的问题:

  1. 播放视频.
  2. 视频播放时/后按"后退"(查看关闭)
  3. 再次打开视图并按"播放".
  4. 视频开始播放并立即暂停.从这一刻起,我将尝试播放的每个视频都会发生同样的情况.

我在具有两种Webview的测试环境中尝试了这一点:"常规"Android Webview和HTML5 webview

我看到的唯一"可疑"的事情是在按下"后退"时出错(Android错误):

sendUserActionEvent() mView == null
Run Code Online (Sandbox Code Playgroud)

这是Galaxy S4问题吗?Android问题?任何的想法?

tnx,Yaniv

javascript html5 android android-webview html5-video

9
推荐指数
1
解决办法
4103
查看次数

Angularjs - 在Protractor e2e测试中模拟触摸事件

我使用Protractor和Jasmine作为我的移动Angularjs应用程序.我想在特定元素上测试触摸事件(touchStart/touchEnd等...).就像是:

it('should play video', function(){
    var poster = by.css('.video-poster');
    element(poster).??? //Simulate touch event here
});
Run Code Online (Sandbox Code Playgroud)

jasmine angularjs angularjs-e2e protractor

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

Angular 2 - 相当于路由器解析新路由器的数据

我正在玩Angular 2.0 new router,我尝试使用类似于Angular 1.X ui-router/ng-route解析机制的东西.

我试图通过以下方式实现此目的RouteData:

import {Component, ViewEncapsulation} from 'angular2/core';
import {
  RouteConfig,
  ROUTER_DIRECTIVES
} from 'angular2/router';
// import {HTTP_PROVIDERS} from 'angular2/http';

import {HomeCmp} from '../home/home';
import {AboutCmp} from '../about/about';
import {NameList} from '../../services/name_list';
import {PersonalizationList} from '../../services/personalization_list';

@Component({
  selector: 'app',
  viewProviders: [NameList, PersonalizationList],
  templateUrl: './components/app/app.html',
  styleUrls: ['./components/app/app.css'],
  encapsulation: ViewEncapsulation.None,
  directives: [ROUTER_DIRECTIVES]
})
@RouteConfig([
  { path: '/', component: HomeCmp, as: 'Home', data: this.history },
  { path: '/about', component: AboutCmp, as: 'About' }
])
export class …
Run Code Online (Sandbox Code Playgroud)

angularjs-new-router angular-new-router angular

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