Question

所以在我的页面上我有数据输出为：

$scope.createIdentity().then(function(identity){
  // When createIdentity resolves, use the data for the AJAX.
  // Return the AJAX promise for the next chained then.
  return $http.get(...);
}).then(function(data){
  // When the AJAX completes, use the data for the socket call
  Socket.connect();
  ...
});

这些值实际上是由服务器输出的，但是我需要独立地重用这些值。我可以传递一个额外的值，例如：

   var firststep = 1;
   var secondstep = 2;
   var thirdstep = 3;
   var fourstep = 4;

   var firststep = 1;
   var secondstep = 2;
   var thirdstep = 3;
   var fourstep = 4;

但其余值如上所述。

我正在尝试使用多个滑块，但两个滑块都使用最后的JS变量，我通过它们传递：

   var category = flight;

然而无法弄清楚我如何处理使用相同变量的多种情况。

Answer 1

如果您使用具有相同变量名称的多个滑块，则应将这些变量包装到对象/模型中。

例如在控制器范围内

$scope.default_values = {
    firststep: 1,
    secondstep: 2,
    thirdstep: 3,
    fourthstep: 4,
};
$scope.slider_1_values = angular.copy($scope.default_values);
$scope.slider_2_values = angular.copy($scope.default_values);

然后在您的视图/控制器中使用相应的slider_1_values或slider_2_values对象。您可以使用ng-model =“slider_1_values”使输入使用特定对象作为其模型。

我认为您的最佳选择是将滑块变为“指令” 因此，您可以通过为其指定不同的模型来重复使用具有不同变量的滑块。

<custom-slider ng-model="slider_1_values"></custom-slider>
<custom-slider ng-model="slider_2_values"></custom-slider>

app.directive('customSlider', function() {
    return {
        "restrict": "E",
        "templateUrl": "yourslider_theme.html",
        "controller": function($scope) {
            //depending on the ng-model="" your 
            $scope.values now contain a different set of same variables
        },
        "link": function($scope, $element, $attr) {
            $scope.values = $scope[$attr['ngModel']];
        }
    };
});

使用重复的javascript变量

1 个答案: