converting angularfirelist to array - ionic-framework

I would like to ask how to subscribe an angularfirelist to an array of objects.
This way doesn't work, here is a preview of my code
Moniteurs: MoniteurModel[];
constructor(public navCtrl: NavController,
public navParams: NavParams,
public db:AngularFireDatabase,
public http: HttpClient) {
this.db.list<MoniteurModel[]>('/Pannes').valueChanges().subscribe((data)=>{
this.Moniteurs.push(data);
}

I want to say there are a few things that can be addressed, but my primarily you are pushing an array from your valuesChanges() subscription into an array. I doubt you wanted that and would rather update the Moniteurs array with the new values from Firebase:
Moniteurs: MoniteurModel[];
constructor(public navCtrl: NavController,
public navParams: NavParams,
public db:AngularFireDatabase,
public http: HttpClient) {
this.db.list<MoniteurModel>('/Pannes').valueChanges().subscribe((values) => {
// If you want to push in values, however this may lead to duplicates
values.forEach((value) => this.Moniteurs.push(value));
// If you want Moniteurs to be just the new data
this.Moniteurs = values;
});
}

Related

InAppBrowser.on('loadstart').subscribe Cannot read properties of undefined (reading 'subscribe')

An undefined error is being thrown on the "browser.on".
public openWithInAppBrowser(url: string) {
let target = "_blank";
var browser = this.theInAppBrowser.create(url, target, this.options);
browser.on('loadstart').subscribe(event => {
console.log(event.url);
});
}
Constructor code contains:
constructor(public storage: Storage, private router: Router, private navCtrl: NavController, private theInAppBrowser: InAppBrowser,
private toastCtrl: ToastController)

ionic: cyclical dependency and cannot resolve all parameters for

I have a component (ItemDetailsPage) that is importing a helper service
import { Helper } from './../../app/Helper';
and in the constructor I have
constructor(public viewCtrl: ViewController, public navCtrl: NavController, public navParams: NavParams,
public helper: Helper...)
In Helper.ts I have the following:
import { ItemDetailsPage } from './../pages/item-details/item-details';
and I use it like that:
showItemWindow() {
let itemModal = this.modalCtrl.create(ItemDetailsPage, null, { cssClass: "modal-fullscreen" });
itemModal.present();
}
When doing the above, I get "cannot resolve all parameters for ItemDetailsPage... I understand that it's because of a circular dependency. I can move showItemWindow to another component and it works but the reason I put it in the helper, is because I need it from 3 different pages and I wanted one place to open this window.
Is there another cleaner solution for this or moving it to 3 different component is the right one? Thanks
Notice how you have 3 periods ... after your declaration of the Helper class in the constructor.Your constructor method should look like below.
constructor(public viewCtrl: ViewController, public navCtrl: NavController, public navParams: NavParams,
public helper: Helper)

How Can I Solve Following Error at Ionic Framework? " Property 'unpaid' does not exist on type 'string'. "

JSON Input:
let url = this.common.apiURLs+"/sapp/viewq?id="+questionId+"&user_id="+val+"&format=json";
Follows: JSON Data Link
Coding:
public mykey: any;
public allData: Array<string> = [];
public userId : any;
public qid : any;
public answerId: any;
public doctorId: any;
public rating: any;
public headers:any;
public ratStar:any;
public feedback:any;
public speciality:any;
public submitQid:any;
public unpaidFree: any;
public queryStatus: any;
public maxKey: any;
constructor(public common: CommonProvider, public navCtrl: NavController, public navParams: NavParams, public fb: FormBuilder, public http: Http, private storage: Storage, public loadingCtrl: LoadingController, public toastCtrl: ToastController, public alertCtrl: AlertController) {
/* Get From Another page */
this.qid = navParams.get('questionId');
this.queryStatus = navParams.get('qstatus');
this.viewQuery(this.qid).then(data => {
this.allData = data;
this.mykey = Object.keys(data);
this.mykey.forEach((key: any) => {
this.maxKey = key;
});
if(this.queryStatus=='unpaid'){
this.unpaidFree = this.allData[this.maxKey].unpaid['fee'];
console.log("Unpaid Free : "+this.unpaidFree);
}
});
}
/* View Query Api Call*/
viewQuery(questionId): Promise<any> {
return new Promise((resolve) => { this.storage.get('id').then((val) => {
let url = this.common.apiURLs+"/sapp/viewq?id="+questionId+"&user_id="+val+"&format=json";
this.http.get(url)
.map(res => res.json())
.subscribe(data => {
resolve(data);
});
});
});
}
I Got Error Following Line:
this.unpaidFree = this.allData[this.maxKey].unpaid['fee'];
Please Explain Me.
Try below code to get fee data from your JSON:
var lastObject = this.allData[this.maxKey];
var unpaid = lastObject['unpaid'];
this.unpaidFree = unpaid['fee'];
Use this to get your value from JSON, Hope this will helps.

Ionic2 constructor, two different classes

I'm creating a simple page and I need to NavController and AlertController, as far as I understood constructor should look like this:
constructor(public alertCtrl: AlertController
, navCtrl: NavController) { }
my problem is that navController is not recognised later in the code. If I change the line to
constructor(public navCtrl: NavController,
alertCtrl: AlertController) { }
Then alertController stops working. Im pretty sure its some newbie syntax issue.
You need to specify public or private for both of them individually
constructor(public navCtrl: NavController,
public alertCtrl: AlertController) { }
You need to add private or public to the services you want to inject because these are parameter proberties. Adding a modifier allows you to create and initialize a member in the same place.
So your code should look like this:
constructor(
public navCtrl: NavController,
public alertCtrl: AlertController
) {}
or this:
constructor(
private navCtrl: NavController,
private alertCtrl: AlertController
) {}
Parameter properties are declared by prefixing a constructor parameter with an accessibility modifier or readonly, or both. Using private for a parameter property declares and initializes a private member; likewise, the same is done for public, protected, and readonly.

why does ionic storage does not work outside a function

I am using ionic 2 with storage.
If I keep the storage code outside of a function it does not work.
kindly let me know.
constructor(public navCtrl: NavController,
public settings: Settings,
public formBuilder: FormBuilder,
public navParams: NavParams,
public translate: TranslateService,
private storage : Storage) {
}
this.settings.load().then(() => {
this.settingsReady = true;
this.options = this.settings.allSettings;
this._buildForm();
});
this.storage.set('nam','par');
}
The constructor is a special function of the class that is responsible for initializing the variables of the class. TypeScript defines a constructor using the constructor keyword. A constructor is a function and hence can be parameterized. Up until the variable get's initialized it remains undefined. so, you can't do in that way and also make no sense, constructor is initialized before anything so either you can do the same operation within constructor or use any life cycle event in ionic to do so.