Question

我在我的应用程序中使用RzSlider v2.0.1中的范围滑块，其中 rz-slider-model value可以是undefined或int值。

以下是我的HTML模板

<tr ng-repeat="feature in categories">
     <td>
      {{feature.featureName}}                                    
      <rzslider rz-slider-model="feature.slider.selectedMin" rz-slider-high="feature.slider.selectedMax" rz-slider-options="{floor:feature.slider.min, ceil:feature.slider.max, onChange: editor.slideChange(categoryId,  feature.value, feature.slider.selectedMin, feature.slider.selectedMax)}"></rzslider>
     </td>
</tr>

模型值可以是这些

[{
     "slider": {
         "min": 0,
         "max": 10,
         "selectedMin": 2,
         "selectedMax": 4
        },
       "value": "1",
       "featureName": "Fuel"
},
{
     "slider": {
         "max": 10,
         "selectedMin": null,
         "selectedMax": 5
        },
       "value": "2",
       "featureName": "Large"
}]

现在，如果我的API中的JSON对象返回为rz-slider-model，如何将0值默认为null。

我尝试设置类似rz-slider-model='feature.slider.selectedMin || 0'的内容但在更改滑块值时遇到异常Error: [$compile:nonassign] Expression 'feature.slider.selectedMin || 0' used with directive 'rzslider' is non-assignable!

您可以找到示例代码here

请帮忙！

Answer 1

在没有对RzSlider进行任何进一步研究的情况下，rz-slider-model必须是不可分配的，以提供双向数据绑定。这意味着您无法使用过滤器（我认为这是您尝试做的？）

表达式feature.slider.selectedMin || 0正在使用逻辑OR。根据selectedMin，它被评估为true / false，这不是指令可以使用的模型。

我建议您只需通过注入$ filter How to use filter in controller来过滤控制器中的数组，或者只是将数组循环到控制器中。

示例循环：

   vm.myApiResponse.forEach(function(item) {
           if(item.selectedMin == null) item.selectedMin = 0;
           if(item.selectedMax == null) item.selectedMax = 0;
          //any property which shouldn't be null
      });

AngularJS RzSlider：如果rz-slider-model未定义或为空，我如何默认？

1 个答案: