我有一个离子选择框,可以更新范围变量。我还有一个作用域函数,它是一个依赖于该作用域变量的函数(例如,它测试变量是否为特定值)。该函数的结果似乎没有随着离子选择框而更新,而它似乎确实在基本的 angularJs 中更新。嵌入实际条件而不是函数似乎适用于ionic。
离子示例:http://codepen.io/anon/pen/VeOXzb
控制器中的相关JavaScript:
$scope.testValue = 'value1';
$scope.variableFunction1 = function() {
return $scope.testValue === 'value2';
}
相关网页:
Does not change: {{variableFunction1()}}<br/>
Does change: {{testValue === 'value2'}}<br/>
<div class="item item-input item-select">
<div class="input-label">
testValue
</div>
<select ng-model="testValue">
<option value="value1">Val1</option>
<option value="value2">Val2</option>
<option value="value3">Val3</option>
</select>
</div>
同样的角度示例,它按我预期工作:http://jsfiddle.net/mm5vg0oa/
这是一个错误还是我误解了ionic中的某些内容?
我的猜测是ion-content
创建一个新的子作用域,这意味着当您在选择中选择值时,会在ion-content
作用域(与控制器作用域不同)上设置一个新的 testValue 变量。
您有两种选择:
- 在
ion-content
内的元素上设置ng-controller
。 - 使用对象而不是字符串来保存所选值(请参阅此处的示例:http://codepen.io/anon/pen/WrBzBq)。
这个页面很好地解释了这个问题: https://github.com/angular/angular.js/wiki/Understanding-Scopes