小编lex*_*ith的帖子

如何在Angular2中操作特定路径上的组件

我有一个简单的TopbarComponent,它基本上在我的视图顶部添加了一个bootstrapish导航栏.

由于90%的模板都应该包含此指令,我想通过我的处理它app.component看起来像这样:

import ...;

@Component({
    selector: 'my-app',
    templateUrl: 'app/app.component.html',
    directives: [ROUTER_DIRECTIVES, TopbarComponent, ...],
    providers: [ROUTER_PROVIDERS, ...]
})

@RouteConfig([
{
    path: '/login',
    name: 'Login',
    component: LoginComponent
},
{
    path: '/dashboard',
    name: 'Dashboard',
    component: DashboardComponent,
    useAsDefault: true
}
])
Run Code Online (Sandbox Code Playgroud)

其模板看起来像这样:

<my-topbar></my-topbar>

<div class="container-fluid">
    <div class="row">
        <router-outlet></router-outlet>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

现在我想使用ngIf(或除了用css隐藏它之外的任何其他方式)来隐藏几条路线上的顶杆,/login例如.我尝试了几种方法在我的使用@CanAcitvate()或实现(以及从我的尝试),但没有任何影响(甚至有问题甚至让功能开火).我得到的最接近的是直接使用我喜欢的:OnActivateLoginComponentAppComponentRouterAppComponent

export class AppComponent implements OnInit{
    showTopbar:boolean;

    constructor(private _router:Router) {}

    ngOnInit():any {
        this.showTopbar = this._router.lastNavigationAttempt != '/login';
    }
} …
Run Code Online (Sandbox Code Playgroud)

angular2-routing angular

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

Android状态栏图标大小 - 使用Cordova/Phonegap推送插件

我正在使用Ionic(Cordova + AngularJS)开发Android应用程序.有了它,我使用推送插件(https://github.com/phonegap-build/PushPlugin)

在我的资源文件夹,我有6个不同的应用程序图标规定,从ldpixxxhdpi

<icon src="resources/android/icon/drawable-ldpi-icon.png" density="ldpi"/>
<icon src="resources/android/icon/drawable-mdpi-icon.png" density="mdpi"/>
<icon src="resources/android/icon/drawable-hdpi-icon.png" density="hdpi"/>
<icon src="resources/android/icon/drawable-xhdpi-icon.png" density="xhdpi"/>
<icon src="resources/android/icon/drawable-xxhdpi-icon.png" density="xxhdpi"/>
<icon src="resources/android/icon/drawable-xxxhdpi-icon.png" density="xxxhdpi"/>
Run Code Online (Sandbox Code Playgroud)

现在我构建了这个之后,我的最终资源文件夹结构如下所示:

android/res/drawable-ldpi/icon.png
android/res/drawable-mdpi/icon.png
Run Code Online (Sandbox Code Playgroud)

等等...

现在,这适用于所有设备上的App图标.但是如果我得到推送通知,状态栏中出现的应用程序图标太大,所以只显示图标的中间(仅在第一秒,似乎之后会重新加载通知(如果我拉)例如,状态栏下方显示正确).

经过一些研究后,我发现我提供的图标对于一般应用程序图标是正确的,但状态栏的图标必须在另一个维度,我在这里发现:Android状态栏需要大小为25x25dp的图标,而指南推荐32x32dp .谁错了?(第二个答案)

例如,使用我的三星s5我为我的xxhdpi图标144*144px切换为72*72px大小的相同图标,它的工作原理.该图标不再被剪切.


现在问我的问题: 我如何设置这个"辅助"图标,我只在我的资源文件夹中用于通知而不覆盖原始图标?

android push-notification cordova phonegap-pushplugin ionic

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

Angular 2集成测试(单元测试样式)

是否可以使用其测试框架(主要针对单元测试设计)针对真实后端测试角度应用程序?

让我们说使用量角器的E2E测试对我来说不是一个选项,但我仍然希望在我的单元测试环境中使用Karma进行一些集成测试.如果可能或不使用Jasmine和angular 2的测试库,我真的很难找到示例甚至声明.

我知道,这不应该是最好的(甚至只是一个好的)练习,但这不是这里的主题.我搜索过的所有地方(我搜索了很多)我都会找到方法MockBackend并且声明"我们不想打到真正的后端......"但是如果有可能则无处可去,如果有的话,怎么做.

我尝试了几种方法("正常"与异步测试),从我的Component Testbed中监视服务方法,直接调用Service函数(在发出后端请求后返回Observable)并尝试从订阅功能,但我的测试不关心.总是跳过这些部分.

想象一下这样的事情:

fit('should show an error if the email entered is invalid', async(() => {
    let accService: any = fixture.debugElement.injector.get(AccountService);
    let accSpy: jasmine.Spy = spyOn(accService, 'isExistingEmail').and.callThrough();
    let checkEmailSpy: jasmine.Spy = spyOn(comp, 'checkEmail').and.callThrough();

    expect(checkEmailSpy).not.toHaveBeenCalled();
    emailInput.triggerEventHandler('blur', null);
    fixture.detectChanges();
    expect(checkEmailSpy).toHaveBeenCalled();
    expect(comp.emailInvalid).toBe(true);

    ...

    accService.isExistingEmail('abcdefg').subscribe((res) => {
        expect(accSpy).toHaveBeenCalledTimes(7);
    }, (err) => {
        expect(accSpy).toHaveBeenCalledTimes(7);
    });

    accSpy.calls.mostRecent().returnValue.subscribe((res) => {
        expect(accSpy).toHaveBeenCalledTimes(7);
    }, (err) => {
        expect(accSpy).toHaveBeenCalledTimes(7);
    });

    ...

}));
Run Code Online (Sandbox Code Playgroud)

现在在此测试的第一部分中,blur事件将触发组件checkEmail功能,该功能将调用我的服务中的某些内容(然后将向另一个服务请求实际的后端调用并返回此可观察对象).如果电子邮件错误,false将返回组件功能并comp.emailInvalid设置为true).

toHaveBeenCalled这部分的测试实际上是通过,但expect(comp.emailInvalid).toBe(true) …

integration-testing jasmine karma-jasmine angular

6
推荐指数
0
解决办法
1202
查看次数

JQVMap - 如何在regionclick上显示数据值

var setMap = function (name) {
        var data = {
            map: 'world_en',
            backgroundColor: null,
            borderColor: '#333333',
            borderOpacity: 0.5,
            borderWidth: 1,
            color: '#c6c6c6',
            enableZoom: true,
            hoverColor: '#c9dfaf',
            hoverOpacity: null,
            values: sample_data,
            normalizeFunction: 'linear',
            scaleColors: ['#b6da93', '#909cae'],
            selectedColor: '#c9dfaf',
            selectedRegion: null,
            showTooltip: true,
            onLabelShow: function (event, label, code) {

            },
            onRegionOver: function (event, code) {
                if (code == 'ca') {
                    event.preventDefault();
                }
            },
            onRegionClick: function (element, code, region) {
                var message = 'You clicked "' + region + '" which has the …
Run Code Online (Sandbox Code Playgroud)

javascript jquery jqvmap

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

Angular 4 - 数组之和

ng4/typescript 的新手并且有一些困难。如何对数组中的项目求和?

添加在此处输入图片说明 例如,它在行动中的样子的屏幕截图

        for (let card of this.cards) {
              for (let val of card.cards){
                if(val.value == "JACK"){
                  val.value = 10;
                }
                if (val.value == "QUEEN"){
                  val.value = 10;
                }
                if (val.value == "KING"){
                  val.value = 10;
                }
                if (val.value == "ACE"){
                  val.value = 10;
                }

                this.hand = Number(val.value) + Number(val.value); (I'm sure this is wrong)

             }
          }
Run Code Online (Sandbox Code Playgroud)

javascript arrays

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