流星依賴選擇

Question

我需要在我的流星應用中實現2個依賴選擇。我是一般的網絡開發新手，流星很新。不過，我已經做了一些有效的工作，但我想知道這是否是正確的方式，或者是否有其他更好的方法來做到這一點。爲什麼我想知道這是因爲我看到了一些我可以很好理解的代碼，所以我寧願按照我認爲的那樣去做。

該選擇是一個與汽車品牌和第二個與所選品牌的型號。

我在流星1.3中使用Session（雖然我已經讀了一點，有些東西叫反應變量也可以使用）。

現在請不要考慮安全問題。

在此先感謝。

這是我的代碼：

const VEHICLE_MODELS = "vehicleModels"; 

function setVehicleModels(vehicleModels){ 
    Session.set(VEHICLE_MODELS, vehicleModels);  
} 

function getVehicleModels(){ 
    return Session.get(VEHICLE_MODELS);  
} 

Template.startJob.events({ 
    'change #carBrands': function(e){ 
     e.preventDefault(); 

     var selectedBrand = $("#carBrands").val(); 
     var vehicleData = Vehicles.findOne({"make":selectedBrand}) 
     setVehicleModels(vehicleData.models);   
    } 
}); 

Template.startJob.helpers({ 
    carBrands(){ 
     return Vehicles.find(); 
    }, 
    carModels(){ 
     return getVehicleModels();   
    }  
}); 

<div class="form-group"> 
         <label for="carBrands" class="col-sm-2 control-label"> 
          Make 
         </label> 
         <div class="col-sm-10"> 
          <select id="carBrands" class="form-control select2"> 
           <option value="">Select a brand...</option> 
           {{#each carBrands}} 
            <option value="{{make}}">{{make}}</option> 
           {{/each}}         
          </select> 
         </div> 
        </div> 
        <div class="form-group"> 
         <label for="carModels" class="col-sm-2 control-label"> 
          Model 
         </label> 
         <div class="col-sm-10"> 
          <select id="carModels" class="form-control select2"> 
           <option value="">Select a model...</option> 
           {{#each carModels}} 
            <option value="{{this}}">{{this}}</option> 
           {{/each}}         
          </select> 
         </div> 
        </div> 

Answer 1

在流星經典模式這是使用由一個事件集和驅動從屬菜單的數據上下文Session變量。由於只需要一個Session變量（或者是一個無功變量），因此這可以簡化您的代碼。

Template.startJob.events({ 
    'change #carBrands': function(e){ 
     e.preventDefault(); 

     var selectedBrand = $("#carBrands").val(); 
     var vehicleData = Vehicles.findOne({ make: selectedBrand }) 
     Session.set('brandId', selectedBrand._id);   
    } 
}); 

Template.startJob.helpers({ 
    carBrands(){ 
     return Vehicles.find(); 
    }, 
    carModels(){ 
     return VehicleModels.find({ brandId: Session.get('brandId') });   
    }  
}); 

不改變你的html。