Question

我正忙着使用Firebase数据库使用Cloud 9和Ionic进行项目。我遇到的问题是引用特定车辆的详细信息（请参阅数据库布局）并在页面上显示该信息。

{
  "userProfile" : {
    "fjN6auulwkguoB4SsUKyiKXZzNx1" : {
          "birthday" : "1997-06-12",
          "drivers" : {
              "-KqbyzU_KKYtpmewoDza" : "Test"
         },
          "email" : "jason@test.com",
          "licenseNum" : "1234",
          "name" : "Tester",
          "password" : "123456",
          "surname" : "Test",
          "vehicles" : {
              "-Kqbywf6e8VkojtLTUyi" : {
                 "location" : "Stellenbosch",
                 "make" : "Mercedes-Benz",
                  "mileage" : "123",
                  "model" : "SLK",
                  "year" : "2017"
             },
                 "-Kqc-yYdd5DKnodnAWe6" : {
                  "location" : "ste",
                 "make" : "BMW",
                  "mileage" : "123124",
                "model" : "dfg",
                "year" : "2016"
             },
        }

因此，基本上用户拥有一个由数据库生成的唯一密钥，其中包含电子邮件生日等属性。此处的目标是引用登录的当前用户访问其唯一密钥，然后显示用户拥有的所有汽车。点击一辆特定的汽车后，它会带您进入一个新页面，其中包含点击汽车的详细信息。我正在努力学习如何引用车钥匙并将这些细节传递给页面。管理以使用“client-profile.ts”中的此代码显示用户详细信息：

export class ClientProfilePage {
  private userPhotoUrl:any;
  private userDisplayEmail : any;
  private userDisplaysName : any;
  private userDisplayName : any;
  private userDisplayBirth : any;
  private userDisplayLicense : any;

  constructor(public navCtrl: NavController, private AuthProvider: AuthProvider) { 

    var myUserid= firebase.auth().currentUser.uid; //current user id
    this.displayUser(myUserid);

  }

  displayUser(theUserId){

    var that = this;

    this.AuthProvider.viewUser(theUserId).then(snapshot => {



       that.userDisplayEmail= snapshot.val().email;
       that.userDisplayName= snapshot.val().name;
       that.userDisplaysName= snapshot.val().surname;
       that.userDisplayBirth= snapshot.val().birthday;
       that.userDisplayLicense= snapshot.val().licenseNum
    })
}

然后是“auth.ts”：

export class AuthProvider {

  public fireAuth:firebase.auth.Auth;
  public userProfileRef:firebase.database.Reference;  
  public userProfile:firebase.database.Reference;  

  constructor(public http: Http) {
    this.fireAuth = firebase.auth();
    this.userProfileRef = firebase.database().ref('/userProfile');   

  }



  loginUser(email: '', password: ''): firebase.Promise<any>{
    return this.fireAuth.signInWithEmailAndPassword(email, password);
  }

  viewUser(userId: any){
            var userRef = this.userProfileRef.child(userId);
            return userRef.once('value'); 
}

任何形式的帮助都将不胜感激！

Answer 1

This solution should give you a nice array containing vehicles as a property of the userProfile that you can use in your view.

You will need to get the uid to create the database reference - you could simply return the uid from your AuthProvider:

let ref = firebase.database().ref('userProfile/' + uid);
const promise = new Promise((resolve, reject) => {
  ref.once('value') // Get the user profile
    .then((userProfile) => {
      ref.child('vehicles') // Get the vehicles
        .once('value')
        .then((vehicles) => {
          var vehicleArray = [];
          vehicles.forEach(vehicle => { // Loop through vehicles and push to array
            vehicleArray.push(vehicle);
          });
          var userProfileWithVehicles = userProfile.val(); 
          userProfileWithVehicles.vehicles = vehicleArray; // Add array of vehicles to userProfile object
          resolve(userProfileWithVehicles);
        });
    });
});

promise.then(userProfile => {
  console.log(userProfile); // Object to give to the view
});

This is a bit messier than your current setup, but the nesting is required to ensure you have all the data. You could do the above in your AuthProvider and return a promise to your ClientProfilePage if you prefer this to be in the provider rather than the code behind the view.

Using the array of vehicles you can loop through and hand the appropriate information off to another page.

如何显示特定数据库子项的详细信息

1 个答案: