小编Sup*_*miu的帖子

上下文

我创建了一个ApiService类来处理我们的自定义API查询,同时使用我们自己的序列化程序+其他功能.

ApiService的构造函数签名是:

constructor(metaManager: MetaManager, connector: ApiConnectorService, eventDispatcher: EventDispatcher);

• MetaManager 是一种处理api的metadatas的可注射服务.
• ApiConnectorService是一个包装的服务,Http用于添加我们的自定义标题和签名系统.
• EventDispatcher 基本上是Symfony的事件调度系统,在打字稿中.

问题

当我测试时ApiService,我做了一个初始化beforeEach:

beforeEach(async(() => {
    TestBed.configureTestingModule({
        imports  : [
            HttpModule
        ],
        providers: [
            ApiConnectorService,
            ApiService,
            MetaManager,
            EventDispatcher,
            OFF_LOGGER_PROVIDERS
        ]
    });
}));

它工作正常.

然后,添加我的第二个规范文件,该文件是ApiConnectorService,与此beforeEach:

beforeEach(async(() => {
    TestBed.configureTestingModule({
        imports  : [HttpModule],
        providers: [
            ApiConnectorService,
            OFF_LOGGER_PROVIDERS,
            AuthenticationManager,
            EventDispatcher
        ]
    });
}));

并且所有测试都因此错误而失败:

错误:无法解析ApiService的所有参数:(MetaManager,？,EventDispatcher).

• 如果我从加载的测试中删除api-connector-service.spec.ts(ApiConnectorService的spec文件),ApiService测试将成功.
• 如果我从加载的测试中删除api-service.spec.ts(ApiService …

对于Web应用程序,我需要使用ajax请求获取我的图像,因为我们的API上有签名+身份验证,因此我们无法使用简单的方法获取图像 <img src="myapi/example/145"/>

由于我们使用的是angular2,我们显然会查找blob或类似的东西,但正如static_response.d.ts文件中所述:

/**
 * Not yet implemented
 */
blob(): any;

好吧,我现在不能这样做,我必须等待你的功能实现.

但问题是我迫不及待所以我需要一个修补程序或一点点黑客才能从响应中获取图像数据,我将能够删除我的hack并将blob()方法调用设置为良好的时候实现它.

我试过这个:

export class AppComponent {
    constructor(private api:ApiService, private logger:Logger){}
    title = 'Tests api';
    src='http://placekitten.com/500/200'; //this is src attribute of my test image
    onClick(){ //Called when I click on "test" button
        this.api.test().then(res => {
            console.log(res._body);
            var blob = new Blob([new Uint8Array(res._body)],{
                type: res.headers.get("Content-Type")
            });
            var urlCreator = window.URL;
            this.src = urlCreator.createObjectURL(blob);
        });
    }
}

与ApiService.test()方法:

test():Promise<any> {
        return this.http.get(this._baseUrl + "myapi/example/145", …

我有这个角度项目,我有一个填充页面的大背景图像和一个带有链接的简单侧边栏,点击后,将用另一个图像(来自cdn)更改背景的URL.由于这些图像相当大,它们需要一两秒才能加载并且它很明显,我想添加一个预加载器,但我不确定如何在角度2中完成.

在我的HTML中我有这个:

<section class="fullsizebg image-bg" [ngStyle]="{'background-image': 'url(' + urlImage + ')'}"></section>

变量urlImage填充在组件的构造函数中,侧边栏链接在单击时更改它的值,使用一个简单的函数,如下所示:

generateImage(data: any){
    this.urlImage = 'http://example.com/mycdn/'+this.data.url+'.jpg';
}

因此,网址实际上会立即更改,但图像需要加载一些.我想添加一个加载gif或类似的东西,以保持图像变化顺利给用户,而不是像现在一样跳跃.

在Angular 1中,您可以通过控制台获取注入器,这样您就可以获得任何服务:

angular.element(document.querySelector('html')).injector().get('MyService')

这对调试非常有用.NG2中的等价物是什么？

当我在应用程序中构建和导航链接但在地址栏中键入时,一切正常!最终,我希望能够通过电子邮件发送指向特定应用页面/路径的链接,我不知道如何实现这一目标.

我已经按照角度路由器指南文档.我认为......

我正在使用NodeJS(带快递),在服务器中我已将所有流量重定向到应用程序根目录.

app.get("*", function(req, res) {
    console.error("in get *")
    res.redirect("/");
});

在我的index.html中,我设置了基础

<base href="/">

我的客户端路径/路径设置如下

const appRoutes: Routes = [
  { path: 'vendor/registration', component: VendorRegistrationComponent },
  { path: 'vendors', component: VendorListComponent },
  { path: '',  redirectTo: 'vendor/registration', pathMatch: 'full' },
  { path: '**', component: PageNotFoundComponent }    
];

如果我输入http://localhost:8080/vendors浏览器地址栏,我会知道http://localhost:8080/vendor/registration哪种有意义,因为这是服务器告诉浏览器重定向到的地方.

那么我应该如何深入链接到我的应用程序？

编辑.Angular教程 - "英雄之旅" - 也表现出相同的行为.即直接在浏览器的地址栏中输入网址不起作用.该应用程序显示"正在加载..."文本,并且不会路由到控制器.

我创建了一个简单的测试应用程

import java.util.logging.Logger;

import org.apache.catalina.Context;
import org.apache.catalina.LifecycleException;
import org.apache.catalina.startup.Tomcat;

public class Main {
  private final static Logger LOGGER = Logger.getLogger(Main.class.getName());
  private final static String mWorkingDir = System.getProperty("java.io.tmpdir");
  private static Tomcat tomcat = null;

  public static void main(String[] args) {

    tomcat = new Tomcat();
    tomcat.setPort(8080);
    tomcat.setBaseDir(mWorkingDir);
    tomcat.getHost().setAppBase(mWorkingDir);
    tomcat.getHost().setAutoDeploy(true);
    tomcat.getHost().setDeployOnStartup(true);

    try {
      tomcat.start();
    } catch (LifecycleException e) {
      LOGGER.severe("Tomcat could not be started.");
      e.printStackTrace();
    }
    LOGGER.info("Tomcat started on " + tomcat.getHost());

    // Alternatively, you can specify a WAR file as last parameter …

编辑

由于我现在没有回答并且我打开的github Ticket已经关闭,我将在github上创建一个示例来重现该bug以找出问题所在.一旦问题得到解决,我将在这个问题上添加我自己的答案,以提供真正的解决方案.

首先,我在SDN的Github上报告了这个问题.

无论如何,我在这里发布我的问题,看看是否有人有解决方案.

所以,我有一个玩家模型:

@NodeEntity
public class Player {

    @GraphId Long id;
    String name;

    String email;

    @Transient
    String password;

    int elo = 1200;

    @RelatedTo(type="FRIEND_WITH", direction = Direction.BOTH)
    Set<Player> friends = new HashSet<Player>();

    //After this I have Getters and Setters
    //no need to paste them all I guess
}

及其存储库接口:

@RepositoryRestResource(collectionResourceRel="player", path="player")
public interface PlayerRepository extends PagingAndSortingRepository<Player, Long> {
}

我使用POST请求创建了两个玩家,并验证它们是使用GET创建的.

然后我想添加玩家0作为玩家1的朋友:

curl -i -X POST -H 'Content-type: text/uri-list' -d 'localhost:8080/api/player/1' http://localhost:8080/api/player/0/friends

我得到一个例外:

HTTP/1.1 500 …

我有一个基本要素:

<div>
    I'm a basic element
</div>

我想创建一个允许我写这个的指令:

<div resizable-top>
    I'm a basic element
</div>

并呈现这个:

<div resizable-top>
    <div> drag me to resize element </div>
    I'm a basic element
</div>

所以,基本上我做了一个指令:

@Directive({
    selector: '[resizable-top]',
    host: {
        '(mousedown)':'onMouseDown()',
        '(mousemove)':'onMouseMove()',
        '(mouseover)':'onMouseOver()'
    }
})
export class ResizableDirective{

    constructor(private el:ElementRef){
    }

    onMouseDown(){
        //TODO
    }

    onMouseMove(){
        //TODO
    }

    onMouseOver(){
        //TODO
    }
}

问题是我不知道如何使用创建子元素el,我希望事件在子元素上绑定,而不是在实际元素上绑定.

由于ElementRef.nativeElement类型anyI我无法找出我可以用来实现我想要的方法/属性.

我*ngFor在一个 of 对象上使用了一个指令array，这些对象有很多属性。

我希望*ngFor仅当其中三个属性发生更改时才进行更新，但根据TrackByFunction 的文档，没有有效的示例说明如何实现这一点。

我尝试返回一个包含其中属性的对象，但它似乎不起作用，因为当任何其他属性发生更改时，模板仍然会再次呈现。

I have a simple feature module, which provides services and imports its own stats fragment as a feature:

@NgModule({
  imports: [
    CommonModule,
    StoreModule.forFeature('alarms', alarmsReducer, { initialState: alarmsInitialState }),
    EffectsModule.forFeature([AlarmsEffects])
  ],
  declarations: [],
  providers: [
    AlarmsFacade,
    AlarmsService
  ]
})
export class AlarmsModule {
}

And I'm importing this module in two other modules, a page that needs to have access to the services, and AppModule as I need to import it here in order to have the state initialized properly.

When …