8
का अप्रत्याशित अंत उपयोगकर्ता पंजीकृत होने के बाद मैं एक अलर्ट प्रदर्शित करने का प्रयास कर रहा हूं। मैंने डीबगिंग और समझने की कोशिश की है कि यह हमेशा त्रुटि फ़ंक्शन पर जा रहा है (जब कोई उपयोगकर्ता सफलतापूर्वक पंजीकृत होता है और कोई उपयोगकर्ता पहले से मौजूद है)।जेसन इनपुट
नीचे मेरा कोड है। मैं समझ नहीं पा रहा हूं कि यह हमेशा त्रुटि में क्यों जा रहा है। किसी भी मदद की सराहना की जाती है क्योंकि मैं लंबे समय से इस से फंस गया हूं। अग्रिम में धन्यवाद।
1) चेतावनी घटक
import { AlertService } from './../../shared/services/alert.service';
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-alert',
templateUrl: './alert.component.html',
styleUrls: ['./alert.component.css']
})
export class AlertComponent {
private _alertService;
private message: any;
constructor(alertService: AlertService) {
this._alertService = alertService;
}
ngOnInit() {
this._alertService.getMessage().subscribe(message => { this.message = message; });
}
}
2.Alert खाका
<div *ngIf="message" [ngClass]="{ 'alert': message, 'alert-success': message.type === 'success',
'alert-danger': message.type === 'error' }">{{message.text}}</div>
3) रजिस्टर खाका
<div class="container">
<h2>Register</h2>
<form name="form" (ngSubmit)="f.form.valid && register()" #f="ngForm" novalidate>
<div class="form-group" [ngClass]="{ 'has-error': f.submitted && !username.valid }">
<label for="username">Username</label>
<input type="text" class="form-control" name="username" [(ngModel)]="model.username" #username="ngModel" required />
<div *ngIf="f.submitted && !username.valid" class="help-block">Username is required</div>
</div>
<div class="form-group" [ngClass]="{ 'has-error': f.submitted && !password.valid }">
<label for="password">Password</label>
<input type="password" class="form-control" name="password" [(ngModel)]="model.password" #password="ngModel" required minlength="10" />
<div *ngIf="f.submitted && !password.valid" class="help-block"> Password is required (minimum 10 characters)</div>
</div>
<div class="form-group">
<button class="btn btn-primary" (click)="registerUser()">Register</button>
<app-alert></app-alert>
<a [routerLink]="['']" class="btn btn-link">Cancel</a>
</div>
</form>
</div>
4) रजिस्टर घटक
import { AlertService } from './../../shared/services/alert.service';
import { RegisterService } from './../../shared/services/register.service';
import { Observable } from 'rxjs/Observable';
import { Component, OnInit } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';
import { AuthService } from '../../shared/services/index';
import { Http, Request, RequestMethod, RequestOptions, Headers, Response } from '@angular/http';
@Component({
selector: 'app-register',
templateUrl: './register.component.html',
styleUrls: ['./register.component.css']
})
export class RegisterComponent implements OnInit {
private _authService: AuthService;
private _alertService: AlertService;
private _regsiterService: RegisterService;
private appContent = 'application/json';
private _router: Router;
private baseUrl = 'http://localhost:5000/api/v1/';
model: any = {};
username: string;
password: string;
constructor(authService: AuthService, http: Http, router: Router, registerService: RegisterService, alertService: AlertService) {
this._authService = authService;
this._regsiterService = registerService;
this._router = router;
this._alertService = alertService;
}
ngOnInit() {
}
registerUser() {
this._regsiterService.registerUser(this.model.username, this.model.password)
.subscribe(
data => {
console.log('Calling alert');
this._alertService.success('Registration Successful');
this._router.navigate(['/login']);
},
error => {
console.log('Calling alert');
// this._alertService.error(error);
});
}
}
5) चेतावनी सेवा
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import {Subject} from 'rxjs/Subject';
@Injectable()
// Checks if a user is a authenticated user and has the valid token without expiration.
export class AlertService {
private subject = new Subject<any>();
success(message: string) {
console.log('Registration Successful');
this.subject.next({ type: 'success', text: message });
}
// error(message: string) {
// console.log('Registration Failed');
// this.subject.next({ type: 'error', text: message });
// }
getMessage(): Observable<any> { return this.subject.asObservable(); }
}
नीचे त्रुटि है स्क्रीनशॉट
@karthikgorijavolu मुझे रजिस्टर घटक –
के लिए स्रोत में कहीं भी 'रजिस्टर() 'विधि नहीं दिखाई देती है रजिस्टर उपयोगकर्ता() –