AngularJS复选框动态NG-真值前pression [英] AngularJS checkbox dynamic ng-true-value expression
问题描述
我试图建立日托价格角计算器。
在本公司专营每个位置都有每天不同的价格。所以我的想法是建立一个形式，一个第一选择，让您选择的位置，然后一系列的复选框的日子。
我在使用中的复选框从我的JSON文件选择正确的价格NG-真值的麻烦。
更新：新增Plunkr：<一href=\"http://plnkr.co/edit/MDmrqaH1VzLBzjd5eHgT?p=$p$pview\">http://plnkr.co/edit/MDmrqaH1VzLBzjd5eHgT?p=$p$pview
考虑这个code：
＆LT; p =类kind_section＆GT;选择地点＆LT; / P＆GT;
＆LT;选择NG模型=formData.locationNG选项=location.title的位置data.bso＆GT;＆LT; /选择＆GT; ＆LT; p =类kind_section＆GT;选择天＆LT; / P＆GT; ＆LT;输入类型=复选框NG模型=location.day.monNG变化=calculatePrice（）NG-真值={{data.bso [formData.location.ID] .prices。星期一}}NG-假值=0＆GT;麻
＆LT;输入类型=复选框NG模型=location.day.tueNG变化=calculatePrice（）NG-真值={{data.bso [formData.location.ID] .prices。星期二}}NG-假值=0＆GT;迪＆所述峰; br /＆GT;
＆LT;输入类型=复选框NG模型=location.day.wedNG变化=calculatePrice（）NG-真值={{data.bso [formData.location.ID] .prices。星期三}}NG-假值=0＆GT;禾
＆LT;输入类型=复选框NG模型=location.day.thuNG变化=calculatePrice（）NG-真值={{data.bso [formData.location.ID] .prices。周四}}NG-假值=0＆GT;走走LT; BR /＆GT;
＆LT;输入类型=复选框NG模型=location.day.friNG变化=calculatePrice（）NG-真值={{data.bso [formData.location.ID] .prices。星期五}}NG-假值=0＆GT; Vr的
首先，选择集FORMDATA与位置ID，那么我想用这个ID来选择当天的价格为匹配位置，并设置那些NG-真值。
我用 NG-真值={{data.bso [formData.location.ID] .prices.monday}}这一点。这是行不通的。
当我手动像设置ID NG-真值={{data.bso [0] .prices.monday}}它的工作。为什么结果选择不被NG-真值回升？
这是我的JSON文件：
$ scope.data = {
BSO：[
{
ID：0，
头衔：Locatie 1
价格： {
星期一：130，
星期二：130，
周三：200，
星期四：130，
星期五：130
}
}，
{
ID：1，
头衔：Locatie 2
价格： {
星期一：430，
星期二：530，
周三：600，
星期四：990，
星期五：730
}
}
]
};
这似乎 NG-真值不接受非恒定前pressions。从文档（V1.3.0）：
的配合使用ngModel（如ngTrueValue或ngFalseValue）某些属性将只接受前不变pressions。的
的使用常量前pressions例子包括：的
＆LT;输入类型=复选框NG模型=...吴真值='truthyValue'＆GT;
＆LT;输入类型=复选框NG模型=...NG-假值=0＆GT;
非恒定前pressions的例子包括：的
＆LT;输入类型=复选框NG模型=...吴真值=someValue中＆GT;
＆LT;输入类型=复选框NG模型=...NG-假值={富：someScopeValue}＆GT;
这是理想的解决方法可能会被调用一个控制器方法 NG-点击或 NG-变化里面，你可以分析所有的复选框truthy或非truthy值。
I'm trying to build a calculator for daycare prices in Angular.
Every location in the company franchise has separate prices for every day. So my thinking was to build a form, with first a select that allows you to select the location, then a series of checkboxes for the days.
I'm having trouble with ng-true-value in the checkboxes selecting the correct prices from my json file.
UPDATE: Added Plunkr: http://plnkr.co/edit/MDmrqaH1VzLBzjd5eHgT?p=preview
Consider this code:
<p class="kind_section">Choose location</p>
<select ng-model="formData.location" ng-options="location.title for location in data.bso"></select>
<p class="kind_section">Select days</p>
<input type="checkbox" ng-model="location.day.mon" ng-change="calculatePrice()" ng-true-value="{{data.bso[formData.location.ID].prices.monday}}" ng-false-value="0">Ma
<input type="checkbox" ng-model="location.day.tue" ng-change="calculatePrice()" ng-true-value="{{data.bso[formData.location.ID].prices.tuesday}}" ng-false-value="0">Di<br />
<input type="checkbox" ng-model="location.day.wed" ng-change="calculatePrice()" ng-true-value="{{data.bso[formData.location.ID].prices.wednesday}}" ng-false-value="0">Wo
<input type="checkbox" ng-model="location.day.thu" ng-change="calculatePrice()" ng-true-value="{{data.bso[formData.location.ID].prices.thursday}}" ng-false-value="0">Do<br />
<input type="checkbox" ng-model="location.day.fri" ng-change="calculatePrice()" ng-true-value="{{data.bso[formData.location.ID].prices.friday}}" ng-false-value="0">Vr
First the select sets formData with a location ID, then I want to use this ID to select the day prices for the matching location and set those to ng-true-value.
I'm using ng-true-value="{{data.bso[formData.location.ID].prices.monday}}" for this. This doesn't work.
When I set the ID manually like ng-true-value="{{data.bso[0].prices.monday}}" it does work. Why is the result of the select not being picked up by ng-true-value?
This is my json file:
$scope.data = {
"bso": [
{
"ID": 0,
"title": "Locatie 1",
"prices": {
"monday": 130,
"tuesday": 130,
"wednesday": 200,
"thursday":130,
"friday": 130
}
},
{
"ID": 1,
"title": "Locatie 2",
"prices": {
"monday": 430,
"tuesday": 530,
"wednesday": 600,
"thursday":990,
"friday": 730
}
}
]
};
It seems ng-true-value does not accept non-constant expressions. From the docs(v1.3.0):
Some attributes used in conjunction with ngModel (such as ngTrueValue or ngFalseValue) will only accept constant expressions.
Examples using constant expressions include:
<input type="checkbox" ng-model="..." ng-true-value="'truthyValue'">
<input type="checkbox" ng-model="..." ng-false-value="0">
Examples of non-constant expressions include:
<input type="checkbox" ng-model="..." ng-true-value="someValue">
<input type="checkbox" ng-model="..." ng-false-value="{foo: someScopeValue}">
An ideal workaround probably would be calling a Controller method on ng-click or ng-change inside which you can analyse all the checkboxes for truthy or non-truthy values.
这篇关于AngularJS复选框动态NG-真值前pression的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
