特定の配列のアイテムのプロパティのプロパティをどのように使用すればよいか理解できません。
以下は、私が取得したJSON応答の例です。
[{
"Id":"3bddaa55-5cae-4d9d-8c2f-3cff9a853aa0",
"ServiceRequestId":"00000000-0000-0000-0000-000000000000",
"AuthorizationRequestId":"48c73685-ee1e-4eea-8bf0-74320d37c80c",
"Quantity":0,
"TreatmentStartDate":null,
"Dosage":{"Id":"cbdbed9e-4c80-4f5a-8a4b-8185c24e45a0",
"Value":13.4,
"Unit":"Spiel mit mehr"},
"Medication":{"IsAutoApproveWhiteList":null,
"IsPartB":null,"Id":"b0f0e31c-3467-4d73-9dd5-e806a20223a3",
"Name":"Pills of Awesomeness",
"Code":"J1100",
"BrandName":"Awesome Pills",
"GenericName":"Awesome",
"UnitOfMeasure":"Pounds",
"Dosages":[{"Id":"dd6e7cfb-252c-46c1-815f-832f9501e9ce",
"Value":100,
"Unit":"Fart"},
{"Id":"4dc88918-c359-41fd-9eb8-50699ba627fd",
"Value":75.6,
"Unit":"Ride wit me."}],
"MedicationType":725060001,
"AllowedDiagnoses":null},
"DirectionsForUse":{"Id":"9faba6ed-5a67-4b45-bedb-a49191274cc7",
"Name":"Do not eat sand",
"IsValidAsLoadingDose":false},
"Refills":0,
"RequiredRegimenMedicationId":null,
"OptionalRegimenMedicationId":null,
"NonRegimenMedicationId":null,
"RequiredRegimenMedicationDosingId":null,
"OptionalRegimenMedicationDosingId":null,
"NonRegimenMedicationDosingId":null,
"DoseType":725060000,
"TypeOfMedication":0,
"MedicationType":0,
"Bsa":null,
"MaximumDosage":null,
"MaximumDosageFormulaId":null,
"NotAutoApprovedReason":0}]
次は私が設定しようとしているコードです:
<table>
<thead>
<tr>
<th>Name</th>
<th>Dose</th>
<th>Directions For Use</th>
<th>Treatment Start Date</th>
<th>Qty</th>
<th>Refills</th>
<th>Purchase Type</th>
</tr>
</thead>
<tbody data-bind="foreach: ServiceItems">
<tr>
<td><span data-bind="text: $root.Medication.DisplayName"></span></td>
<td><span data-bind=""></span></td>
<td><span data-bind=""></span></td>
<td><span data-bind=""></span></td>
<td><span data-bind="text: Quantity"></span></td>
<td><span data-bind="text: Refills"></span></td>
<td><span data-bind=""></span></td>
</tr>
</tbody>
</table>
@section Scripts
{
<script type="text/javascript">
function ServiceItem(data) {
var self = this;
self.TreatmentStartDate = ko.observable(data.TreatmentStartDate);
self.ServiceRequestId = data.ServiceRequestId;
self.DoseType = ko.observable(data.DoseType);
self.Medication = ko.observable(data.Medication);
self.Dosage = ko.observable(data.Dosage);
self.DirectionForUse = ko.observable(data.DirectionForUse);
self.RequiredRegimenMedicationId = ko.observable(data.RequiredRegimenMedicationId);
self.RequiredRegimenMedicationDosingId = ko.observable(data.RequiredRegimenMedicationDosingId);
self.OptionalRegimenMedicationId = ko.observable(data.OptionalRegimenMedicationId);
self.OptionalRegimenMedicationDosingId = ko.observable(data.OptionalRegimenMedicationDosingId);
self.NonRegimenMedicationId = ko.observable(data.NonRegimenMedicationId);
self.NonRegimenMedicationDosingId = ko.observable(data.NonRegimenMedicationDosingId);
self.Quantity = ko.observable(data.Quantity);
self.Refills = ko.observable(data.Refills);
}
function Medication(data) {
var self = this;
self.Name = data.Name;
self.Code = data.Code;
self.BrandName = data.BrandName;
self.GenericName = data.GenericName;
self.UnitOrMeasure = data.UnitOrMeasure;
self.Dosages = data.Dosages;
self.MedicationTypes = data.MedicationTypes;
self.AllowedDiagnoses = data.AllowedDiagnoses;
self.DisplayName = ko.computed(function () {
if (self.Name != null && self.Name != "") {
return self.Name;
} else {
return self.BrandName;
}
});
}
function Dosage(data) {
var self = this;
self.Id = data.Id;
self.Value = data.Value;
self.unit = data.Unit;
}
function DirectionForUse(data) {
var self = this;
self.Id = data.Id;
self.Name = data.Name;
self.IsValidAsLoadingDose = data.IsValidAsLoadingDose;
}
function ServiceItemsViewModel() {
var self = this;
self.ServiceItems = ko.observableArray();
//Operations
self.add = function(item) {
self.ServiceItems.add(item);
};
self.remove = function(item) {
self.ServiceItems.remove(item);
};
}
var viewModel = new ServiceItemsViewModel();
$.getJSON('/Mapping/GetServiceItems', function (data) {
ko.mapping.fromJS(data, {}, viewModel.ServiceItems);
});
ko.applyBindings(viewModel);
</script>
}
私が欲しいのは、最初の列で、foreachバインディングの実行中にMedication計算メソッドを起動させることです。私が正しく呼んでいない行は次のとおりです。
<td><span data-bind="text: $root.Medication.DisplayName"></span></td>
FireBugsコンソールに表示されるエラーメッセージは次のとおりです。
エラー:バインディングを解析できません。メッセージ:TypeError:$root.Medicationは未定義です。バインディング値:テキスト:$ root.Medication.DisplayName
Medicationプロパティに伝播し、そのメソッドを適切にトリガーするにはどうすればよいですか?
ありがとう!
編集:
<td><span data-bind="text: $root.Medication.DisplayName"></span></td>
への変更:
<td data-bind="text: Medication.DisplayName"></td>
また、関数内にアラートを追加しましたが、トリガーされません。
function Medication(data) {
var self = this;
self.Name = data.Name;
self.Code = data.Code;
self.BrandName = data.BrandName;
self.GenericName = data.GenericName;
self.UnitOrMeasure = data.UnitOrMeasure;
self.Dosages = data.Dosages;
self.MedicationTypes = data.MedicationTypes;
self.AllowedDiagnoses = data.AllowedDiagnoses;
self.DisplayName = ko.computed(function () {
alert('Explode Please');
if (self.Name != null && self.Name != "") {
return self.Name;
} else {
return self.BrandName;
}
});
}
現在の結果はエラーを生成せず、このテーブルの結果は次のとおりです。