Question

我正在开发角度js的Web应用程序。我有文本框和指令。我的文本框应该只采用某个范围内的值，否则应显示错误消息。 HTML代码下方。

<input class="" type="text" name="rangeNumber" ng-attr-placeholder="{{ 'DownPayment' }}" ng-model="DownPayment" range-number="range">

<ul class="error-msgs">
    <li ng-show="!form5.rangeNumber.$invalid && form5.rangeNumber.$dirty">Number not in range</li>
</ul>

以下是我的指示。

app.directive('rangeNumber', function () {
    return {
        require: 'ngModel',
        link: function (scope, elem, attrs, ctrl) {
            if (!ctrl) return;

            var range = scope.$eval(attrs.rangeNumber);
            range = range.split(',').map(Number);

            ctrl.$parsers.push(function (value) {
                value = +value;
                var isValidRange = !(value >= range[0] && value <= range[1]);

                ctrl.$setValidity('range', isValidRange);
                return value;
            });


        }
    };
});

以下是我分配范围的功能。

function fillsiebelloandetails(SiebelLoanDetails)
{
  //some http ajax call and get values and assign it ti range.
  $scope.range = '1,7';
}

如果我指定$ scope.range ='1,7'，我将面临问题;在fillsiebelloandetails里面它不起作用。如果我写$ scope.range ='1,7';外部功能它工作正常。我可以知道为什么会这样吗？任何帮助，将不胜感激。谢谢。

Answer 1

您需要在指令

中观察rangeNumber更改

    link: function (scope, elem, attrs, ctrl) {
        if (!ctrl) return;

        scope.$watch(attrs.rangeNumber, function(){
            var range = scope.$eval(attrs.rangeNumber);
            range = range.split(',').map(Number);

            ctrl.$parsers.push(function (value) {
               value = +value;
               var isValidRange = !(value >= range[0] && value <= range[1]);

               ctrl.$setValidity('range', isValidRange);
              return value;
            });

        })



    }

Answer 2

在函数中定义变量时，其范围被视为功能（本地）范围，因此问题已经发生。您应该在指令级范围内声明变量。为此，您可以尝试如下。

在函数外声明变量。
然后从函数内部分配值。

EG。

......

    var vm=this;
    vm.range=[];   //declare variable outside the function 
    function fillsiebelloandetails(SiebelLoanDetails)
    {
      //some http ajax call and get values and assign it ti range.
      vm.range = '1,7';
    }

我想我可能会对你有帮助。

Angularjs将值分配给不在函数内部工作的范围

2 个答案: