Angular js内联表达式和条件

时间:2016-03-02 06:52:44

标签: html angularjs expression conditional-statements

如何编写多个html内联表达式和条件。

情况

滚动时

{{step}}值应根据条件发生变化

我的控制器

controller(){
 $scope.step = 1;
  $scope.sectionOneValue   = 100;
  $scope.sectionTwoValue   = 200;
  $scope.sectionThreeValue = 300;

 scroll function(){
   $scope.scrollValue =  chaningValue
 }
}

内联角度表达和条件

if scrollValue  > sectionOneValue 
   step = 1;
if scrollValue  > sectionTwoValue 
   step = 2;
if scrollValue  > sectionThreeValue 
   step = 3;

我的目标是

{{ step | angular expression and condition }}

1 个答案:

答案 0 :(得分:2)

您应该将所有数据工作提取到控制器。

示例:

在控制器中:

$scope.getStep = function(scrollValue) {
    if (scrollValue > sectionOneValue) {
        return 1;
    } else if (scrollValue > sectionTwoValue) {
        return 2;
    } else if (scrollValue > sectionThreeValue) {
        return 3;
    }
}

在模板中:

.... //scrollValue initialized to this moment
<span ng-bind="getStep(scrollValue)"></span>
....