Javascript 如何在AngularJS指令的模板中使用ng repeat和先前声明的函数？

使用AngularJS，我试图创建一个指令，以模板化表单中的问题。对于特定类型的问题，我想为特定范围内的每个数字创建单选按钮。我有一个外部函数，它返回给定上下限的数字数组

如何使用这个外部函数，以及ng repeat来模板化这类问题？这是我到目前为止试过的代码

HTML:

这是一道测试题。选择一个介于1和5之间的数字。

你选了{{cxnTestVarA}}。

JS:

<代码>var module=角度模块（'app'，[]） .directive（'qtnrange'，function（）{ 返回{ 范围：{ qtnVariable:“=”， firstNum:“=”， lastNum:“=”， 界限：“&范围”， }, 模板： '' + '' + “{{iter}}”+ “

---

”， restrict:'E'，//必须是HTML元素 是的， 替换：正确， }; }); 变量范围=功能（开始、结束、步骤）{ …返回数组[]的函数 }

---

下面是一个JSFIDLE的工作示例：

我所做的是将范围函数移动到示波器上，并使用ng单击无线电输入，而不是将它们与ng模型绑定

基本上，改变这一点：

module.directive('qtnrange', function() {
    return {
        scope: {
            qtnVariable: '=',
            firstNum: '=',
            lastNum: '=',
            bounds: '&range',
        },
        template:
            '<div class=question>' + 
                '<label ng-transclude></label>' +
                '<label class="radio inline" ng-repeat="iter in bounds(firstNum, lastNum)"><input type="radio" value="{{iter}}" ng-model="qtnVariable">{{iter}} </label>' +
            '<hr></div>',
        restrict: 'E', // must be an HTML element
        transclude: true,
        replace: true,
    };
});

var range = function() {

}

module.directive（'qtnrange'，function（）{
返回{
范围：{
qtnVariable:“=”，
firstNum:“=”，
lastNum:“=”，
界限：“&范围”，
},
模板：
'' + 
'' +
“{{iter}}”+
“
”，
restrict:'E'，//必须是HTML元素
是的，
替换：正确，
};
});
变量范围=函数（）{
}

为此：

module.directive('qtnrange', function() {
    return {
        scope: {
            qtnVariable: '=',
            firstNum: '=',
            lastNum: '='
        },
        template:
            '<div class=question>' + 
                '<label ng-transclude></label>' +
                '<label class="radio inline" ng-repeat="iter in range(firstNum, lastNum)"><input type="radio" value="{{iter}}" ng-click="setNum(item)">{{iter}} </label>' +
            '<hr></div>',
        restrict: 'E', // must be an HTML element
        transclude: true,
        replace: true,
        controller: function($scope) {
            $scope.setNum = function(num) {
                $scope.qtnVariable = num;
            }
            $scope.range = function() {
                // ...
            }
        }
    };
});

module.directive（'qtnrange'，function（）{
返回{
范围：{
qtnVariable:“=”，
firstNum:“=”，
lastNum:“=”
},
模板：
'' + 
'' +
“{{iter}}”+
“
”，
restrict:'E'，//必须是HTML元素
是的，
替换：正确，
控制器：功能（$scope）{
$scope.setNum=函数（num）{
$scope.qtnVariable=num；
}
$scope.range=函数（）{
// ...
}
}
};
});

你能提供一个JSFIDLE来演示这个问题吗？下面是仍然不太确定你想在这里做什么，但我已经在这里将JSFIDLE更新为工作状态：事实上，这正是我想做的（在一定范围内每个数字都有单选按钮）——谢谢你修复我的代码！如果你把你的回答作为对这个问题的回答，我会把它作为正确的回答。

module.directive('qtnrange', function() {
    return {
        scope: {
            qtnVariable: '=',
            firstNum: '=',
            lastNum: '=',
            bounds: '&range',
        },
        template:
            '<div class=question>' + 
                '<label ng-transclude></label>' +
                '<label class="radio inline" ng-repeat="iter in bounds(firstNum, lastNum)"><input type="radio" value="{{iter}}" ng-model="qtnVariable">{{iter}} </label>' +
            '<hr></div>',
        restrict: 'E', // must be an HTML element
        transclude: true,
        replace: true,
    };
});

var range = function() {

}

module.directive('qtnrange', function() {
    return {
        scope: {
            qtnVariable: '=',
            firstNum: '=',
            lastNum: '='
        },
        template:
            '<div class=question>' + 
                '<label ng-transclude></label>' +
                '<label class="radio inline" ng-repeat="iter in range(firstNum, lastNum)"><input type="radio" value="{{iter}}" ng-click="setNum(item)">{{iter}} </label>' +
            '<hr></div>',
        restrict: 'E', // must be an HTML element
        transclude: true,
        replace: true,
        controller: function($scope) {
            $scope.setNum = function(num) {
                $scope.qtnVariable = num;
            }
            $scope.range = function() {
                // ...
            }
        }
    };
});