Question

我已经为输入，选择和无线电指令创建了一个指令。

<input ng-model="data-ng-model="answers.{{name}}"无效

这是我的HTML：

<div ng-repeat="que in questions[$state.current.name]">
    <div ng-if="que.QuestionData._fieldType === 'text'" >
        <text-control-dir data-que-obj="que.QuestionData" data-selected-ans="answers[que.QuestionData._attributeName]"></text-control-dir>
    </div>  
    <div ng-if="que.QuestionData._fieldType === 'select'" >
        <select-control-dir data="que.QuestionData"></select-control-dir>
    </div>
    <div ng-if="que.QuestionData._fieldType === 'radio'" >
         <radio-control-dir data="que.QuestionData"></radio-control-dir>
    </div>
    <div ng-if="que.QuestionData._fieldType === 'hidden' && que.QuestionData._attributeName != 'CBQ'" >
         <hidden-control-dir data="que.QuestionData"></hidden-control-dir>
    </div>
</div>

这是我的指示：

   function textControlDir()
    {
        return {
            transclude: true,
            restrict: 'E',
            /*scope: {
                queObj: '=',
                selectedAns: '='
                },*/
            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 data-ng-model="answers.{{name}}" type="text" name="{{name}}" class="form-control" id="{{id}}" value="{{selectedAns}}"></div>\n\
                       </div>',
            link: function (scope, element, attrs)
            {
                var queObj = scope.que.QuestionData;
                scope.queObj = scope.que.QuestionData; 
                scope.name = queObj._attributeName;
                scope.id = queObj._attributeName;
                var selectedAns = '';
                if(scope.answers)
                {
                   selectedAns = scope.answers[scope.name];
                }
                if(selectedAns && selectedAns != '')
                {
                    scope.selectedAns = selectedAns;
                }
                else
                {
                    scope.selectedAns = scope.queObj._pageAttributes.defaultValue;
                } 
            }
        };
    }

如何动态管理ng-model？我想在用户更改输入框中的任何内容时映射$scope.answers.{{name}}。

Answer 1

您可以要求ngModel。

return {
    require: 'ngModel',
}

然后，您可以使用ngModel.$setViewValue(newValue);

相应地更新ng-model

以下是achieve如何相同的简单示例：

http://jsfiddle.net/t2GAS/2/

Answer 2

你可以这样做：

 data-ng-model="name"

现在在控制器中你可以这样做：

$scope.answers.name = name; // <--- the ng-model assigned to answer.name in $scope

AngularJS：如何设置ng-model或从指令更改范围值

2 个答案: