将AngularJS值绑定到Zurb Foundation Slider

Question

我需要协助将AngularJS值绑定到Zurb Foundation元素。我有一个滑块和一个输入框，显示它旁边的滑块的值，我希望能够使用AngularJS更新该值，但是在元素属性中添加任何Angular代码会使滑块无法运行。如果我在数据端输入{{attrib}}，它将破坏滑块。

<div id="VideoContainer" ng-controller="MainController as mainCtrl">
<div id = 'Controls' ng-controller="SettingsControlsController as setCtrl">
    <div class="slider" data-slider data-initial-start="2" data-end="8">
      <span class="slider-handle"  data-slider-handle role="slider" tabindex="1" aria-controls="numVideos"></span>
      <span class="slider-fill" data-slider-fill></span>
    </div>
    <input type = "number" id="numVideos" />
</div>