javascript - 在 angular.js 中渲染逻辑？

Question

我有三个模型属性年份、指标、地理来控制数据可视化的呈现。

根据此模型中的更改，我希望能够控制可视化的渲染:

  //Pseudo code
  watch function ( year, indicator, geography ) {
     if(geography.previous == a && geography.current == b){
        renderA()
     }
     if(geography.previous == a && year == 1950){
        renderB()
     }
  }

如上面的示例所示，我希望能够将先前值与当前值以及模型更改的任意组合进行比较，以确定渲染。

我如何在 Angular 中进行设置？
(可能包括模型服务并观察多个属性......)

Answer 1

如果你想观察多个属性，那么你可以用对象包装它们并观察对象的深层变化

$scope.obj = {
   year : ...
   indicator : ...
   geography : ...
}
$scope.$watch('obj', function(newValue, oldValue) {
   // your logic dependent on changes
}, true);

注意 $watch 函数的第三个 true 参数。它负责观察深层变化。

我不知道你想要渲染什么，但如果这些是完全不同的模板那么你可以使用 ngSwitch .

我不确定使用某种服务是否是正确的选择。我倾向于某种指令。主要是因为服务没有范围。您可以用指令包装所有内容，并将数据传递给执行渲染和逻辑的指令。