Base solution for your next web application

Activities of "jonas452"

i'm assuming i still have to add some js lib and perhaps some css file. Only i don't know where the right place is to add those. the angular 2 project structure is somewhat a mysterie to me :o

Question

Hi,

I'm quite the novice regarding angular and typescript so i am sorry for asking such a basic and easy question. However i can't seem to figure this one out.

In a plane modal i want to use the metronic ui datepicker. i've copied this from the metronic example page to my modal.

<div class="input-group date" data-provide="datepicker">
    <input type="text" class="form-control">
    <div class="input-group-addon">
        <span class="glyphicon glyphicon-th"></span>
    </div>
</div>

however it remains a basic text field.

what am i forgetting? Can you point me in the right direction? Thx.

this is my create-employee-modal.component.ts class and html page

import { Component, Injector, OnInit } from '@angular/core';
import { AppComponentBase } from '@shared/common/app-component-base';
import { appModuleAnimation } from '@shared/animations/routerTransition';
import { PersonServiceProxy, EmployeeDto, ListResultDtoOfEmployeeDto } from '@shared/service-proxies/service-proxies';

@Component({
    templateUrl: './employeepanel.component.html',
    animations: [appModuleAnimation()]
})
export class EmployeePanelComponent extends AppComponentBase implements OnInit {

    employees: EmployeeDto[] = [];
    filter: string = '';

    constructor(
        injector: Injector,        
        private _personService: PersonServiceProxy
    ) {
        super(injector);
    }

        ngOnInit(): void {
        this.getEmployee();
    }

    getEmployee(): void {
        this._personService.getEmployees(this.filter).subscribe((result) => {
            this.employees = result.items;
        });
    }

}
<div bsModal #modal="bs-modal" (onShown)="onShown()" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="modal" aria-hidden="true" [config]="{backdrop: 'static'}">
    <div class="modal-dialog">
        <div class="modal-content">
            <form *ngIf="active" #employeeForm="ngForm" novalidate (ngSubmit)="save()">
                <div class="modal-header">
                    <button type="button" class="close" (click)="close()" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                    <h4 class="modal-title">
                        <span>{{l("CreateNewEmployee")}}</span>
                    </h4>
                </div>
                <div class="modal-body">
                    
                    <div class="form-group form-md-line-input form-md-floating-label no-hint">
                        <input #nameInput class="form-control" type="text" name="name" [(ngModel)]="employee.name" required maxlength="32">
                        <label>{{l("Name")}}</label>
                    </div>

                    <div class="form-group form-md-line-input form-md-floating-label no-hint">
                        <input class="form-control" type="text" name="firstName" [(ngModel)]="employee.firstName" required maxlength="32">
                        <label>{{l("Surname")}}</label>
                    </div>                    

                    <div class="form-group form-md-line-input form-md-floating-label no-hint">
                        <input class="form-control" type="email" name="email" [(ngModel)]="employee.email" required maxlength="255" pattern="^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{1,})+$">
                        <label>{{l("EmailAddress")}}</label>
                    </div>

                    <div class="form-group form-md-line-input form-md-floating-label no-hint">
                        <input class="form-control" type="text" name="phoneNr" [(ngModel)]="employee.phoneNr" >
                        <label>{{l("PhoneNr")}}</label>
                    </div> 

<div class="input-group date" data-provide="datepicker">
    <input type="text" class="form-control">
    <div class="input-group-addon">
        <span class="glyphicon glyphicon-th"></span>
    </div>
</div>
                    <div class="form-group form-md-line-input form-md-floating-label no-hint">                        
                        <input class="form-control"
                                type="date" name="dateOfBirth" [(ngModel)]="employee.dateOfBirth" >
                        
                    </div>                                       

                </div>
                <div class="modal-footer">
                    <button [disabled]="saving" type="button" class="btn btn-default" (click)="close()">{{l("Cancel")}}</button>
                    <button type="submit" class="btn btn-primary blue" [disabled]="!employeeForm.form.valid" [buttonBusy]="saving" [busyText]="l('SavingWithThreeDot')"><i class="fa fa-save"></i> 
                    <span>{{l("Save")}}</span></button>
                </div>
            </form>
        </div>
    </div>
</div>
Question

Hi,

I noticed that we have now a new node called encryptedAccessToken.
{ "result": { "accessToken": "eyJhbGciOiJIUzI1NiIsInR5cCI6I...................3yS-RmskAfvAmmbPkvQ6Oc", "encryptedAccessToken": "HIINu1cszB7Ow78yl1ysFrluu7uhEg0.....pQvj5MXUQFZRqvQ==", "expireInSeconds": 86400, "shouldResetPassword": false, "passwordResetCode": null, "userId": 0, "requiresTwoFactorVerification": false, "twoFactorAuthProviders": null, "twoFactorRememberClientToken": null }, "targetUrl": null, "success": true, "error": null, "unAuthorizedRequest": false, "__abp": true }

However i can't seem to find any documentation on it. All i need now is the accessToken. Will that change?

thx Jonas.

Exactly what i needed. Thx!

I am directly testing on the swagger ui. And yes, no Authenticationheader is being send with my request. So that seems to be the problem.

Let's say i want to test purely on swagger ui? how do i make sure the authenticationheader is being send? I also have tried using postman. Seems to be a great testing suite.

Which method do i need to execute on the webapi to receive a cookie with a tenant id? I thought it was /api/services/app/Account/IsTenantAvailable. But postman isn't receiving a cookie for that.

Basicly i need a small nudge in the right direction so i know how to test my api's directly. Thanks for any further info.

jonas

Hi,

I've got the angular 2 project up and running. Now for testing i would like to use de web api side directly. When i use the authenticate method everything goes fine.

When i check the cookies i can see token being stored.

But when i run any kind of method i receive this response

What am i forgetting?

I also have tried loggin in with the angular client and then using the web api. The result is the same. The client itself works just fine.

Hi,

I'm testing your new solution Angular 2 and .net core. I managed to get it up and running. However i've noticed there is no front end application, by that i mean like those of your other solutions. You call it a landing page for people that ar not logged in. (not login page).

Is it gone, will it be added in the future or am i missing something?

Thx, Jonas

Answer

If you want so change db because of license cost. I'd suggest MariaDB. I'm using it right now.

Just change(extend,..) the user class and update by using code-first migrations. Certainly don't do it manually on your sql database.

I think you mean this? <a class="postlink" href="https://github.com/aspnetzero/aspnet-zero-angular">https://github.com/aspnetzero/aspnet-zero-angular</a> Looks like its angular 2

Showing 11 to 20 of 28 entries