Angular Js如何在指令

时间:2016-07-22 11:13:25

标签: javascript jquery angularjs

我创建了表单控件的指令[input,select和radio], 每个输入都有默认值,如果$ scope.answers有此输入值,则此值应显示在输入框中。

以下代码无法使用link fucntion

if($scope.answers.PC && $scope.answers.PC != '')
                {
                    element.val = $scope.answers.PC;
                }

指令功能

function textControlDir()
    {
        return {
            transclude: true,
            restrict: 'E',
            scope: {
                queObj: '=',
                },
            template: '<div class="form-group">\n\
<label for="{{queObj._attributeName}}" class="col-sm-5 control-label">{{queObj._text}}</label>\n\
<div class="col-sm-6"><input type="text" name="{{queObj._attributeName}}" class="form-control" id="{{queObj._attributeName}}" value="{{queObj._pageAttributes.defaultValue}}"></div>\n\
</div>'
            ,
            link: function ($scope,scope, element, attrs)
            {
                if($scope.answers.PC && $scope.answers.PC != '')
                {
                    element.val = $scope.answers.PC;
                }
                console.log($scope);
            }
        };
    }

HTML

<text-control-dir data-que-obj="que.QuestionData"></text-control-dir>

1 个答案:

答案 0 :(得分:0)

您无法直接访问指令中的$scope,但由于您拥有link功能,因此您可以访问相应指令的scope。但是,您无法设置当前正在执行的值.val是一种错误的设置方式:

link: function(scope, element, attrs) {
    if (scope.answers && scope.answers !== undefined) {
      element.find('input').val(scope.answers.PC); // <---this is the way to set value
    }else{
      element.find('input').val('No vales found!!!');
    }
  }

其中element是包装元素div,您必须在其中放置文本输入.find('input') 1

<子> 1。如果角度之前未包含jQuery库,则角度将使用jqLite,并且.find()方法仅限于查找 tagNames 仅限。

Plnkr

刚看到,您的范围没有answers属性。所以,那是行不通的。